模态弹出窗口不会显示 [英] Modal popup will not display
问题描述
我有一个模态弹出窗口,当我测试时工作正常。在测试中,我只是将代码放在页面顶部,我按下按钮将其打开。我有正确的基础,所以我将targetid更改为嵌套标签容器中的正确按钮。
结果现在是按钮单击我得到背景像模态的变化应该在那里,但没有任何显示,没有弹出窗口。页面ACTS喜欢它(不能做任何其他事情等),但没有任何可见的,只是改变了背景。
我发布了这个问题和代码另一个论坛。他们可以运行它,它适用于他们。它不适合我。我被困在这里。
任何帮助都表示赞赏。我想我错过了一些愚蠢的东西...
I have a modal popup which when I tested works fine. In testing I just put the code near the top of the page where I placed the button to open it. I have the basics right so I changed the targetid to the correct button which is in a nested tab container.
The result now is on the button click I get the background change like the modal should be there but nothing shows up, no popup. The page ACTS like it's there (can't do anything else etc.) but there is nothing visible, just the changed background.
I posted this question and code on another forum. They can run it and it works fine for them. It does not for me. I'm stuck here badly.
Any help is appreciated. I'm thinking I'm missing something silly...
<%--THIS IS THE ADD LOCATIONS BUTTON OUTSIDE THE TAB CONTANIER--%>
<asp:Button
ID="AddLocationButton"
runat="server"
Text="Add Location"
Visible="false" />
<%--THIS IS THE MAIN TAB CONTAINER WITH ONLY A SINGLE TAB FOR THE LOCATION --%>
<ajaxToolkit:TabContainer
class="tabcontainer"
ID="LocationsTabContainer"
runat="server"
ActiveTabIndex="0">
<%--THIS IS THE FIRST TAB PANEL FOR LOCATIONS. MACHINE AND LOCATION DETAILS ARE UNDER THIS--%>
<ajaxToolkit:TabPanel
ID="TabPanel1"
runat="server"
HeaderText="location">
<ContentTemplate>
<%--ADD MACHINE BUTTON--%>
<asp:Button
ID="AddMachineButton"
runat="server"
Text="Add Machine"
Visible="false" />
<%-- THIS IS THE MACHINES TAB CONTAINER--%>
<ajaxToolkit:TabContainer
class="tabcontrol"
ID="MachinesTabContainer"
runat="server"
ActiveTabIndex="0" CssClass="">
<%--THIS IS THE MACHINE TAB--%>
<ajaxToolkit:TabPanel
ID="MC1"
runat="server"
HeaderText="MC1">
<ContentTemplate>
<asp:Button
ID="AddCISButton"
runat="server"
Text="New CIS"
Visible="false" />
<ajaxToolkit:Accordion
ID="MCDA"
CssClass="accordion"
HeaderCssClass="accordionHeader"
HeaderSelectedCssClass="accordionHeaderSelected"
ContentCssClass="accordionContent"
runat="server"
FadeTransitions="True"
FramesPerSecond="40"
RequireOpenedPane="False"
TransitionDuration="200"
Height="300px"
Width="790px">
<Panes>
<ajaxToolkit:AccordionPane
ID="MCDAP1"
runat="server" ContentCssClass="" HeaderCssClass="">
<Header>
<asp:Label
ID="MCDAP1HeaderLabel"
runat="server"
Text="Machine details">
</asp:Label>
</Header>
<Content>
<table class="table test">
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="SerialLabel"
runat="server"
Text="serial"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="SerialtextBox"
runat="server"
Text="enter serial"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="PrimaryContactLabel"
runat="server"
Text="Contact"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="PrimaryContactTextBox"
runat="server"
Text="primary contact"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="TypeLabel"
runat="server"
Text="Type:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="TypeTextBox"
runat="server"
Text="MC Type"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="MakeLabel"
runat="server"
Text="Make:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="MakeTextBox"
runat="server"
Text="MC Make"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="ModelLabel"
runat="server"
Text="Model:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="ModelTextBox"
runat="server"
Text="MC Model"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="InstallDateLabel"
runat="server"
Text="Install date:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="InstallDateTextBox"
runat="server"
Text="Install Date"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="InstallTechLabel"
runat="server"
Text="Install tech:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="InstallTechTextBox"
runat="server"
Text="Install Tech"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="WarrantyLengthLabel"
runat="server"
Text="Warranty length:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="WarrantyLengthTextBox"
runat="server"
Text="WarrantyLength"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="1" valign="middle">
<asp:Label
ID="WarrantyExpirationLabel"
runat="server"
Text="Warranty expiration:"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
</td>
<td colspan="1" valign="middle">
<asp:Label
ID="WarrantyExpirationTextBox"
runat="server"
Text="WarrantyExpiration"
>
</asp:Label>
</td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="ShowOrderDetails" runat="server" Text="Show order details" />
</td>
</tr>
<tr>
<td colspan="4">
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
</table>
<br />
<asp:Label
ID="CommentsLabel"
runat="server"
Text="Comments"
ForeColor="Black"
Font-Bold="True">
</asp:Label>
<br />
<asp:TextBox
ID="CommentsTetBox"
runat="server"
class="control3pxsolid"
textMode="MultiLine"
Columns="96"
Rows="5">
</asp:TextBox>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPane
ID="MCDAP2"
runat="server" ContentCssClass="" HeaderCssClass="">
<Header>
<asp:Label
ID="MCDAP2HeaderLabel"
runat="server"
Text="CIS & Service Calls">
</asp:Label>
</Header>
<Content>
<asp:TreeView
ID="MCTV"
runat="server"
ExpandDepth="0"
Font-Size="Small"
NodeWrap="True"
NodeIndent="15">
<SelectedNodeStyle Font-Bold="True" />
</asp:TreeView>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>
<ajaxToolkit:DropShadowExtender
ID="MCDA_DropShadowExtender"
runat="server"
Enabled="True"
TargetControlID="MCDA">
</ajaxToolkit:DropShadowExtender>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
<ajaxToolkit:RoundedCornersExtender
ID="MachinesTabContainer_RoundedCornersExtender"
runat="server"
Enabled="True"
TargetControlID="MachinesTabContainer">
</ajaxToolkit:RoundedCornersExtender>
<ajaxToolkit:DropShadowExtender
ID="MachinesTabContainer_DropShadowExtender"
runat="server"
Enabled="True"
TargetControlID="MachinesTabContainer">
</ajaxToolkit:DropShadowExtender>
<br />
<br />
<%--THIS IS THE LOCATION DETAILS TAB CONTAINER--%>
<ajaxToolkit:TabContainer
class="tabcontrol"
ID="LocationInfoTabContainer"
runat="server"
ActiveTabIndex="0" CssClass="">
<%--PHONE TAB PANEL--%>
<ajaxToolkit:TabPanel
ID="Phone"
runat="server"
HeaderText="Phone numbers"
Height="1000px">
<ContentTemplate>
<%--testing modalpopup for adding data--%>
<ajaxtoolkit:modalpopupextender id="ModalPopupExtender1" runat="server"
cancelcontrolid="btnCancel" okcontrolid="btnOkay"
targetcontrolid="NewPhoneButton" popupcontrolid="Panel1"
popupdraghandlecontrolid="PopupHeader" drag="true"
backgroundcssclass="ModalPopupBG">
</ajaxtoolkit:modalpopupextender>
<asp:panel id="Panel1" style="display: none" runat="server">
<div class="HellowWorldPopup">
<div class="popupHeader" id="PopupHeader">Header</div>
<div class="PopupBody">
<table>
<tr>
<td>
Phone type
</td>
<td>
<asp:DropDownList
ID="PhoneTypeDDL"
runat="server"
width="205px"
DataSourceID="PhoneTypeSQLDS"
DataTextField="ListItem"
DataValueField="ListItemID"
AppendDataBoundItems="true">
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
Phone number (EG: 269.964.7181)
</td>
<td>
<asp:TextBox
ID="PhoneNumberTB"
runat="server"
Width="200px">
</asp:TextBox>
</td>
</tr>
<tr>
<td>
You can add additional phone numbers later.
</td>
<td>
<asp:Button
ID="AddPhoneButton"
runat="server"
Text="Save phone number."/>
</td>
</tr>
</table>
</div>
<div class="Controls">
<input id="btnOkay" type="button" value="Done" />
<input id="btnCancel" type="button" value="Cancel" />
</div>
</div>
</asp:panel>
<asp:Button
ID="NewPhoneButton"
runat="server"
Text="New Phone" />
<br />
<asp:TreeView
ID="PhoneTV"
runat="server"
ExpandDepth="0"
Font-Size="Small"
NodeWrap="True"
NodeIndent="15">
<SelectedNodeStyle Font-Bold="True" />
</asp:TreeView>
</ContentTemplate>
</ajaxToolkit:TabPanel>
<%--ADDRESS TAB PANEL--%>
<ajaxToolkit:TabPanel
ID="Address"
runat="server"
HeaderText="Addresses">
<ContentTemplate>
<asp:Button
ID="NewAddressButton"
runat="server"
Text="New Address" />
<br />
<asp:TreeView
ID="AddressTV"
runat="server"
ExpandDepth="0"
Font-Size="Small"
NodeWrap="True"
NodeIndent="15">
<SelectedNodeStyle Font-Bold="True" />
</asp:TreeView>
</ContentTemplate>
</ajaxToolkit:TabPanel>
<%--CONTACTS TAB PANEL--%>
<ajaxToolkit:TabPanel
ID="Contact"
runat="server"
HeaderText="Contacts">
<ContentTemplate>
<asp:Button
ID="NewContactButton"
runat="server"
Text="New Contact" />
<br />
<asp:TreeView
ID="ContactsTV"
runat="server"
ExpandDepth="0"
Font-Size="Small"
NodeWrap="True"
NodeIndent="15">
<SelectedNodeStyle Font-Bold="True" />
</asp:TreeView>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
<ajaxToolkit:RoundedCornersExtender
ID="LocationInfoTabContainer_RoundedCornersExtender"
runat="server"
Enabled="True"
TargetControlID="LocationInfoTabContainer">
</ajaxToolkit:RoundedCornersExtender>
<ajaxToolkit:DropShadowExtender
ID="LocationInfoTabContainer_DropShadowExtender"
runat="server"
Enabled="True"
TargetControlID="LocationInfoTabContainer">
</ajaxToolkit:DropShadowExtender>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
<%-- <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="newlocation()" />
--%>
<ajaxToolkit:RoundedCornersExtender
ID="LocationsTabContainer_RoundedCornersExtender"
runat="server"
Enabled="True"
TargetControlID="LocationsTabContainer">
</ajaxToolkit:RoundedCornersExtender>
<ajaxToolkit:DropShadowExtender
ID="LocationsTabContainer_DropShadowExtender"
runat="server"
Enabled="True"
TargetControlID="LocationsTabContainer">
</ajaxToolkit:DropShadowExtender>
</div>
</div>
What I have tried:
Problem is ONLY when the code is inside the tab panel. Outside the container it works correctly.
What I have tried:
Problem is ONLY when the code is inside the tab panel. Outside the container it works correctly.
推荐答案
Can you show your code example here..After that may be i can fix it easily. I can’t imagine what’s going on there..But seems you are in minor issue. Check your html and target id as well.
Can you show your code example here..After that may be i can fix it easily. I can't imagine what's going on there..But seems you are in minor issue. Check your html and target id as well.
这篇关于模态弹出窗口不会显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!