Currently, I am encountering a critical issue while implementing ajaxmodalpopupextender on my webpage. The functionality operates smoothly in Firefox with an appealing appearance, however, it encounters display problems in IE where it appears to the side and the background does not align as intended.
I have attempted numerous solutions such as:
- Utilizing CSS
Placing the panel within a div and configuring
div style="position:absolute;left:140;top:100;"
Adjusting the page's Doctype to xhtml
Unfortunately, none of these strategies have resolved the issue. Any assistance would be greatly appreciated.
The current Doctype in use is as follows: -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
I am presently stuck and seeking help.
Please helpppppppppp.
This modification will only be visible to you until peer reviewed.
May I inquire about the version of Internet Explorer you are testing this on? It would also be helpful if you could share your code snippet.
Below is the GridView section: -
<GridView id= "Grd" runat="server" AutoGenerateColumns="false" CssClass="GridStyle"
HeaderStyle-Font-Size="Small" Width="960" Visible="false">
<Columns>
'Columns goes here
<asp:TemplateField HeaderText="Action" HeaderStyle-Width="310px" ItemStyle-HorizontalAlign="Left">
<ItemTemplate>
<asp:Button ID="btnDelete" runat="server" Text="Delete" OnClick="btnDelete_Click"
CommandArgument='<%#Eval("intHireEnquiryID") %>' />
<asp:Button ID="btnPlace" runat="server" Text="Place" OnClick="btnPlace_Click"
CommandArgument='<%#Eval("intHireEnquiryID") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</GridView>
Here is the ModalPopup content: -
<asp:UpdatePanel ID="upPopupPnl" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel runat="server" ID="pnlPopup" Width="300px" Height="300px" BackColor="Azure"
style="overflow:auto;border-color:Black;border-style:solid;border-width:2px;">
<table><tr><td colspan="2" style="width:300px;">
<asp:RadioButtonList ID="rbl1" runat="server">
</asp:RadioButtonList>
</td></tr>
<tr><td style="text-align:center;">
<asp:Button ID="btnPlacePopup" runat="server" Text="Place" Width="100" Height="35" Font-Bold="true"
OnClick="btnPlacePopup_Click" />
</td>
<td style="text-align:center;">
<asp:Button ID="btnCancel" runat="server" Text="Cancel" Width="100" Height="35" Font-Bold="true" />
</td></tr>
</table>
</asp:Panel>
<asp:Button ID="btnDummy" runat="server" Text="Not Display" style="display:none;"/>
<ajaxtk:ModalPopupExtender ID="actPopup1" runat="server" TargetControlID="btnDummy" BackgroundCssClass="modalBackground"
PopupControlID="pnlPopup" CancelControlID="btnCancel">
</ajaxtk:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
Referencing the Css class: -
.modalBackground
{
background-color:#B3B3CC;
opacity:0.5;
}
Code behind: -
dim intHireEnquiryIDas integer
Protected Sub btnPlace_Click(ByVal sender As Object, ByVal e As System.EventArgs)
intHireEnquiryID = CType(sender, Button).CommandArgument
Dim EXP As New Exception
Dim params(0) As SqlParameter
params(0) = New SqlParameter("@intHireEnquiryID", intHireEnquiryID)
Dim DS As New DataSet
DS = execQuery("spAgent_Get_Assigned_Workers", executionType.SPExecuteForDS, EXP, params)
If DS.Tables(0).Rows.Count > 0 Then
rbl1.DataSource = DS
rbl1.DataTextField = "WorkerDetail"
rbl1.DataValueField = "intWorkerID"
rbl1.DataBind()
End If
upPopupPnl.Update()
actPopup1.Show()
End Sub
While the functionality works flawlessly in FireFox, the popup fails to render at the center in IE. Additionally, the background does not align correctly as specified. At this point, I am completely stuck and would appreciate any assistance. Thank you in advance.