We Keep Coding

ModalPopupExtender calling .Show() does not work

I am using Visual Studio 2010 and for database I am using Entity Framework 4.
In my page , I have 3 tabs and in Second tab I used Grid view for displaying the Details of Employee . In that Grid View there are 2 image button one for Delete another for Edit. I want to open a popup box whenever I will click Edit Image Button.
The problems are
1. Popup box is appear for a second only.
2. Able to retrieve the row index of the Grid view. But no value is pass into other text box, it showing null value i.e. name0.Text= ""
In my .aspx page I have the following
For Image Button
<asp:ImageButton ID="edit" runat="server" CommandArgument='<%# Bind("EmpID")%>' CommandName="edituser" ImageUrl="image/images.jpg" ToolTip="Edit User Details" OnClick="EditUser_Clicked"> </asp:ImageButton>
For ModalPopupExtender
<asp:ToolkitScriptManager ID="Toolkitmgr" runat="server"></asp:ToolkitScriptManager>
<asp:HiddenField ID="EmpID" runat="server"
onvaluechanged="EmpID_ValueChanged"/>
<asp:ModalPopupExtender ID="mpedit" DropShadow="true" BackgroundCssClass="modalBackground"
PopupControlID="pnedit" CancelControlID="btnCancel"
runat="server" TargetControlID="EmpID"></asp:ModalPopupExtender>
<asp:Panel runat="server" ID="pnedit" CssClass="modalPopup" Style="display: block;width:525px">
***Some Code***
</asp:Panel>
In the server side code for the EditUser_Clicked event I have the following:
protected void EditUser_Clicked(object sender, EventArgs e)
{
ImageButton btndetails = sender as ImageButton;
GridViewRow row = (GridViewRow)btndetails.NamingContainer;
lblId.Text = GridView1.DataKeys[row.RowIndex].Value.ToString();
name0.Text = row.Cells[1].Text;
desig0.Text = row.Cells[2].Text;
dob0.Text = row.Cells[3].Text;
email0.Text = row.Cells[4].Text;
country0.Text = row.Cells[5].Text;
city0.Text = row.Cells[6].Text;
add0.Text = row.Cells[7].Text;
hq0.Text = row.Cells[8].Text;
rbtnListGender0.Text = row.Cells[9].Text;
mobno0.Text = row.Cells[10].Text;
this.mpedit.Show();
}
The code runs without error but modal popup is not visible. Please help me to find my mistake.

There 3 ways You can use Modal Popup using Update Panel.Try any one of this.
Modal Popup with UpdatePanel inside PopupPanel
<div style="background-color: White">
<asp:Button runat="server" ID="button4" Text="Launch Modal Popup1" />
<asp:Panel runat="server" ID="modalPanel3" Style="display: none">
<asp:UpdatePanel runat="server" ID="updatePanel3">
<ContentTemplate>
<asp:Label runat="server" ID="label4" Text="Label in UpdatePanel"></asp:Label>
<asp:Button runat="server" ID="Button5" Text="Click to Cause postback" OnClick="Button5_Click" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:Button runat="server" ID="Button6" Text="OK" />
<asp:LinkButton runat="server" ID="LinkButton1" Text="Cancel" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender runat="server" ID="modalPopupExtender3" TargetControlID="button4"
PopupControlID="modalPanel3" OkControlID="Button6" CancelControlID="LinkButton1"
BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
</div>
2.Update Panel that contains a ModalPopup and its associated PopupPanel inside it
<asp:UpdatePanel runat="server" ID="updatePanel2" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:Button runat="server" ID="button2" Text="Launch Modal Popup2" />
<asp:Panel runat="server" ID="modalPanel2" BackColor="AliceBlue" Style="display: none">
<asp:Label runat="server" ID="label5" Text="Label in UpdatePanel"></asp:Label>
<asp:Button runat="server" ID="postbackBtn" Text="Click to Cause postback" OnClick="postbackBtn_Click" /><br />
<asp:Button runat="server" ID="cancelBtn2" Text="OK" />
<asp:LinkButton runat="server" ID="okBtn2" Text="Cancel" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender runat="server" ID="modalPopupExtender2" TargetControlID="button2"
PopupControlID="modalPanel2" OkControlID="okBtn2" CancelControlID="cancelBtn2"
BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
3.Update Panel that contains a ModalPopup; its PopupPanel has an UpdatePanel inside it
<asp:UpdatePanel runat="server" ID="outerUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="false">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="outerPanelTrigger" />
</Triggers>
<ContentTemplate>
<asp:Button runat="server" ID="outerPanelTrigger" Text="OuterPanelTrigger" /><br />
<br />
<asp:Button runat="server" ID="button1" Text="Launch Modal Popup3" />
<asp:Panel runat="server" ID="modalPanel1" BackColor="Pink" Style="display: none">
<asp:UpdatePanel runat="server" ID="updatePanel1" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label runat="server" ID="label1" Text="Label in UpdatePanel"></asp:Label>
<asp:Button runat="server" ID="updateLabel" OnClick="updateLabel_Click" Text="Click to Cause postback" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:Button runat="server" ID="okBtn" Text="OK" />
<asp:LinkButton runat="server" ID="cancelBtn" Text="Cancel" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender runat="server" ID="modalPopupExtender1" TargetControlID="button1"
PopupControlID="modalPanel1" OkControlID="okBtn" CancelControlID="cancelBtn"
BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>

Are you using the latest version of AjaxControlToolkit?
In v16.1 the following bugs were fixed:
Item 27971 - Modal Popup incorrect z-index in tab container and
update panel
Item 28021 - Multiple ModalPopupExtenders z-index
issue

C# Infinite Nested DataList

I have a relatively simple question about nested DataList.
How to dynamically nest infinite DataLists?
I didn't write any code yet, because I don't know how, but follow is an example:
<form id="form1" runat="server">
<div>
<asp:DataList ID="DataList1" runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" />
<br />
<asp:DataList ID="DataList2" runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
<br />
<asp:Button ID="Button2" runat="server" Text="Button" />
</ItemTemplate>
</asp:DataList>
</ItemTemplate>
</asp:DataList>
</div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"></asp:SqlDataSource>
</form>
There are no problems when we have limited levels depth, we just nest two or three levels on DataList and we are done. But when we don't have a defined levels depth.
When the button clicked it loads the DataList2, when DataList2 button is clicked and it should load DataList3 and so far. And repeat it every time I click the button inside a DataList.
e.g.
-DatalistOUTER
--Some bindings
--Button [clicked]
[loads]
----DatalistINNER
-----Some bindings
-----Button [clicked]
[loads]
------DatalistINNERINNER
-------Somebindings
-------Button

Multiple buttons in update panel

Will something like this work? If it does, how do I determine which button was clicked on post?
<asp:UpdatePanel ID="MainUpdatePanel" runat="server"><ContentTemplate><div class="home_c" id="home_c2">
<div class="home-tabs">
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Cures" ID="cures_btn" runat="server" />
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Conditions" ID="conditions_btn" runat="server" />
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Recent" ID="recent_btn" runat="server" />
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Uncured" ID="uncured_btn" runat="server" />
</div>
<div class="home-search">
</div>
</div>
</ContentTemplate></asp:UpdatePanel>

Yes it will work. Just add OnClick events for each and have your click events defined in your code behind to handle them. Simple as that. :)
E.g.
<asp:Button CssClass="home_tab" ClientIDMode="static" Text="Cures" ID="cures_btn" runat="server" OnClick="cures_btn_Click" />
And in your code behind
protected void cures_btn_Click(object sender, EventArgs e)
{
// Some code
}

ModalPopupExtender closes when UpdatePanel inside is updated

I have a ModalPopupExtender with an UpdatePanel inside. The UpdatePanel has a Repeater with a list of LinkButtons.
<asp:Button ID="btnShow" runat="server" />
<ajaxToolkit:ModalPopupExtender ID="mpe" runat="server" TargetControlID="btnShow" PopupControlID="pnl" CancelControlID="btnCancel" />
<asp:Panel ID="pnl" runat="server">
<asp:UpdatePanel ID="up" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Repeater ID="rep" runat="server" onitemcommand="rep_ItemCommand">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li>
<asp:Label ID="lblAssignedTo" runat="server" Text='<%# Eval("AssignedTo") %>' />
<asp:LinkButton ID="lnkUnassign" runat="server" CommandName="Unassign" CommandArgument='<%# Eval("Id") %>' />
<ajaxToolkit:ConfirmButtonExtender ID="cbeUnassign" runat="server" TargetControlID="lnkUnassign" ConfirmText="Are you sure you want to unassign this item?" />
</li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
protected void rep_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName == "Unassign")
{
//do something
up.Update();
}
}
When I click on a LinkButton, the UpdatePanel should update. It does this but it closes the ModalPopupExtender also.
Is there any way to update the UpdatePanel without hiding the ModalPopupExtender? I can just call ModalPopupExtender.Show(), but the page flickers.
Thanks.

Okay, just found out that there's something wrong with LinkButtons inside Repeaters. Used a Button control instead.

user control inside dynamic user control click event not firing?

I have a page where there is a div, for which the user controls are added dynamically through the code using the LoadControl of user control.
The user control contains another user control (lets say ChildUC).
The ChildUC contains a gridview which has Insert and Delete buttons.
The problem is, even though I click on these buttons, the click event is not getting fired nor the gridview command event.
The page is being postbacked and just exits after the page load, it is not firing any other events.
I am debugging this for last few days so far, but of no luck.
Please do help me. Thanks in Advance.
Code:
<div id="dvMain" runat="server">
</div>
private void CreateHeaders()
{
foreach (Header hd in HeaderCollection)
{
List<Question> lstQuestion = QuestionCollection.FindAll(p => p.HID.Equals(hd.HeaderID));
Sales_UserControls_Questions Question = null;
if (lstQuestion.Count > 0)
{
Question = (Sales_UserControls_Questions)LoadControl("~/Sales/UserControls/Questions.ascx"); // This is the main user control that is being loaded dynamically
Question.ID = "Question"+hd.HID;
Question.lstQuestions = lstQuestion;
}
dvMain.Controls.Add(Header);
if (HQQuestion != null)
dvMain.Controls.Add(Question); // user control being added to div
}
}
//Questions.ascx
<div>
<asp:GridView ID="grdContent" runat="server" AutoGenerateColumns="False"
OnRowDataBound="grdContent_RowDataBound" EnableTheming="False">
<Columns>
<asp:TemplateField ShowHeader="false">
<ItemTemplate>
<asp:HiddenField ID="hdnQuestionID" runat="server" Value='<%# Eval("QID") %>' />
<asp:HiddenField ID="hdnQuestionType" runat="server" Value='<%# Eval("QTP") %>' />
<asp:Label ID="lblQuestionID" runat="server" EnableTheming="False" Text='<%# Eval("QID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<asp:Label ID="lblSHR" runat="server"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblText" runat="server" Text='<%# Eval("Text") %>'></asp:Label>
<div>
<asp:UpdatePanel ID="UpnlDGV" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<DG:View ID="ucDGView" runat="server"></DG:View>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
//end of questions.ascx
//ucDGView.ascx
<div>
<asp:GridView ID="grdDGView" runat="server"
AutoGenerateColumns="False" OnRowDataBound="grdDGView_RowDataBound" OnRowDeleting="grdDGView_RowDeleting"
OnRowCreated="grdDGView_RowCreated" HeaderStyle-Font-Bold="true" OnRowCommand="grdDGView_RowCommand">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<dl id="dvNT" runat="server">
<dt>
<asp:Label ID="lblNT" runat="server" Text="NT:"></asp:Label>
</dt>
<dd>
<asp:DropDownList ID="ddlNM" runat="server">
</asp:DropDownList>
</dd>
</dl>
<dl id="dvOSD" runat="server" class="grid_6 alpha MT10" visible="false">
<dt>
<asp:Label ID="lblOSDT" runat="server" Text="OSDT:"></asp:Label>
</dt>
<dd>
<asp:TextBox ID="txtOSDT" runat="server" MaxLength="10" CssClass="maskDate"></asp:TextBox>
<asp:CalendarExtender ID="txtOSDTE" runat="server" TargetControlID="txtOSDT"
Enabled="True" Format="MM/dd/yyyy">
</asp:CalendarExtender>
</dd>
</dl>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="imgBtnDelete" runat="server" ImageUrl="~/Sales/Common/Images/delete_red_mini.jpg"
CausesValidation="false" CssClass="cancel" CommandName="Delete" CommandArgument='<%#DataBinder.Eval(Container.DataItem, "OID")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="imgBtnAdd" runat="server" ImageUrl="~/Sales/Common/Images/PLUS_MINI.png"
CausesValidation="false" CssClass="cancel" CommandName="Add" CommandArgument='<%#DataBinder.Eval(Container.DataItem, "QID")%>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
//end of ucDGView.ascx

What you need to understand here is where in the asp.net page life cycle does it receive the event from the frontend.
The event that triggers the postback is sent back to asp.net is a hidden form element called the event target.
This input is processed in in a function called the ProcessPostData.
If your control is not present in the controls collection by then, it cannot receive the event. So you get a postback, but no event handlers are fired.
That means, if you want your event handlers to fire, you must create all your controls before the load event. It seems you have to decide which controls to load depending upon some user input. User inputs are not available on Init. You can override the LoadViewState method, and process your user input there.