PLease tell me why the modalpopupextender control won't show

Last post 03-01-2009 9:59 AM by dvn. 2 replies.

Sort Posts:

  • PLease tell me why the modalpopupextender control won't show

    02-28-2009, 6:44 PM
    • Member
      12 point Member
    • dvn
    • Member since 02-18-2009, 3:59 PM
    • Posts 27

    Here are the exact codes:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolKit" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head runat="server">

    <title>Untitled Page</title>

    <style type="text/css">

    TR.updated TD

    {

    background-color:yellow;

    }

    .modalBackground

    {

    background-color:Gray;

    filter:alpha(opacity=70);

    opacity:0.7;

    }

    </style>

    </head>

    <body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <div>

    <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}" SelectMethod="GetAllCustomers"

    TypeName="DataAccessDB" DeleteMethod="DeleteCutomer" OnDeleting="ObjectDataSource1_Deleting">

    <DeleteParameters>

    <asp:Parameter Name="ContactName" Type="String" />

    <asp:Parameter Name="original_CustomerID" Type="String" />

    </DeleteParameters>

    </asp:ObjectDataSource>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <ContentTemplate>

    <asp:HiddenField ID="hiddenID" runat="server"/>

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="#999999" BorderStyle="None" BorderWidth="1px"

    CellPadding="3" DataSourceID="ObjectDataSource1" GridLines="Vertical" AllowSorting="True" DataKeyNames="CustomerID" OnSelectedIndexChanged="GridView1_SelectedIndexChanged" OnRowDeleting="GridView1_RowDeleting" OnRowCommand="GridView1_RowCommand">

    <RowStyle BackColor="#EEEEEE" ForeColor="Black" />

    <FooterStyle BackColor="#CCCCCC" ForeColor="Black" />

    <PagerStyle BackColor="#999999" ForeColor="Black" HorizontalAlign="Center" />

    <SelectedRowStyle BackColor="#008A8C" Font-Bold="True" ForeColor="White" />

    <HeaderStyle BackColor="#000084" Font-Bold="True" ForeColor="White" />

    <AlternatingRowStyle BackColor="Gainsboro" />

    <Columns>

    <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" SortExpression="CustomerID" />

    <asp:BoundField DataField="ContactName" HeaderText="Name" SortExpression="ContactName" />

    <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Address" />

    <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />

    <asp:BoundField DataField="PostalCode" HeaderText="PostalCode" SortExpression="PostalCode" />

    <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" />

    <asp:TemplateField HeaderText="Command">

    <ItemTemplate>

    <asp:Button ID="btnDelete" runat="server" Text="Delete" CommandName="Delete" />

    </ItemTemplate>

    </asp:TemplateField>

    </Columns>

    </asp:GridView>

    </ContentTemplate>

    </asp:UpdatePanel>

    <asp:Panel ID="pnlPopUp" runat="server" style="display:none">

    <asp:UpdatePanel ID="updpnlNewContactName" runat="server" UpdateMode="Conditional">

    <ContentTemplate>

    <asp:Button ID="btnShowPopUP" runat="server" style="display:none" />

    <ajaxToolKit:ModalPopupExtender ID="mdlPopUp" runat="server" PopupControlID="pnlPopUp" BackgroundCssClass="modalBackground"

    TargetControlID="btnShowPopUP" CancelControlID="btnClose"></ajaxToolKit:ModalPopupExtender>

    <table>

    <tr>

    <td>Enter New Contact Name</td>

    </tr>

    <tr>

    <td><asp:TextBox ID="txtNewContactName" runat="server"></asp:TextBox></td>

    </tr>

    <tr>

    <td><asp:Button id="btnSave" runat="server" Text="Save" CausesValidation="true" OnClick="BtnSave_Click" />&nbsp;&nbsp;

    <asp:Button ID="btnClose" runat="server" Text="Cancel" CausesValidation="false" /></td>

    </tr>

    </table>

    </ContentTemplate>

    </asp:UpdatePanel>

    </asp:Panel>

    </div>

    </form>

    </body>

    </html>

    c# file: 

    using System;

    using System.Data;

    using System.Configuration;

    using System.Web;

    using System.Web.Security;

    using System.Web.UI;

    using System.Web.UI.WebControls;

    using System.Web.UI.WebControls.WebParts;

    using System.Web.UI.HtmlControls;

    public partial class _Default : System.Web.UI.Page

    {

    protected void Page_Load(object sender, EventArgs e)

    {

     

    }

     

    protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)

    {

     

    }

    protected void ObjectDataSource1_Deleting(object sender, ObjectDataSourceMethodEventArgs e)

    {

    e.InputParameters[
    "CustomerID"] = hiddenID.Value;e.InputParameters["ContactName"] = txtNewContactName.Text;

    }

    protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)

    {

    string id = GridView1.Rows[e.RowIndex].Cells[0].Text;

    hiddenID.Value = id;

    }

    protected void BtnSave_Click(object sender, EventArgs args)

    {

    if (this.Page.IsValid)

    {

    // hide the modal popup

    this.mdlPopUp.Hide();

    }

    }

    protected void ObjectDataSource1_Selected(object sender, ObjectDataSourceStatusEventArgs e)

    {

    // it comes here second

    }

    protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)

    {

    if(e.CommandName.Equals("Delete"))

    {

    this.mdlPopUp.Show();

    }

    }

    }

  • Re: PLease tell me why the modalpopupextender control won't show

    02-28-2009, 11:22 PM
    • Participant
      1,242 point Participant
    • vinay_jss
    • Member since 11-11-2008, 6:50 AM
    • New Delhi
    • Posts 179

    Hello

    your popup panel must be present in same update panel.

    you have given modal popup in different update panel and panel in different update panel.

    see the bold code, i have modified it. 

     <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolKit" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head runat="server">

    <title>Untitled Page</title>

    <style type="text/css">

    TR.updated TD

    {

    background-color:yellow;

    }

    .modalBackground

    {

    background-color:Gray;

    filter:alpha(opacity=70);

    opacity:0.7;

    }

    </style>

    </head>

    <body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <div>

    <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}" SelectMethod="GetAllCustomers"

    TypeName="DataAccessDB" DeleteMethod="DeleteCutomer" OnDeleting="ObjectDataSource1_Deleting">

    <DeleteParameters>

    <asp:Parameter Name="ContactName" Type="String" />

    <asp:Parameter Name="original_CustomerID" Type="String" />

    </DeleteParameters>

    </asp:ObjectDataSource>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <ContentTemplate>

    <asp:HiddenField ID="hiddenID" runat="server"/>

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="#999999" BorderStyle="None" BorderWidth="1px"

    CellPadding="3" DataSourceID="ObjectDataSource1" GridLines="Vertical" AllowSorting="True" DataKeyNames="CustomerID" OnSelectedIndexChanged="GridView1_SelectedIndexChanged" OnRowDeleting="GridView1_RowDeleting" OnRowCommand="GridView1_RowCommand">

    <RowStyle BackColor="#EEEEEE" ForeColor="Black" />

    <FooterStyle BackColor="#CCCCCC" ForeColor="Black" />

    <PagerStyle BackColor="#999999" ForeColor="Black" HorizontalAlign="Center" />

    <SelectedRowStyle BackColor="#008A8C" Font-Bold="True" ForeColor="White" />

    <HeaderStyle BackColor="#000084" Font-Bold="True" ForeColor="White" />

    <AlternatingRowStyle BackColor="Gainsboro" />

    <Columns>

    <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" SortExpression="CustomerID" />

    <asp:BoundField DataField="ContactName" HeaderText="Name" SortExpression="ContactName" />

    <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Address" />

    <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />

    <asp:BoundField DataField="PostalCode" HeaderText="PostalCode" SortExpression="PostalCode" />

    <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" />

    <asp:TemplateField HeaderText="Command">

    <ItemTemplate>

    <asp:Button ID="btnDelete" runat="server" Text="Delete" CommandName="Delete" />

    </ItemTemplate>

    </asp:TemplateField>

    </Columns>

    </asp:GridView>

    </ContentTemplate>

    </asp:UpdatePanel>

    <asp:Panel ID="pnlPopUp" runat="server" style="display:none">// remove this line

    <asp:UpdatePanel ID="updpnlNewContactName" runat="server" UpdateMode="Conditional">

    <ContentTemplate>

    <asp:Button ID="btnShowPopUP" runat="server" style="display:none" />

    <ajaxToolKit:ModalPopupExtender ID="mdlPopUp" runat="server" PopupControlID="pnlPopUp" BackgroundCssClass="modalBackground"

    TargetControlID="btnShowPopUP" CancelControlID="btnClose"></ajaxToolKit:ModalPopupExtender>

    <asp:Panel ID="pnlPopUp" runat="server" style="display:none">//i have added this line

     

    <table>

    <tr>

    <td>Enter New Contact Name</td>

    </tr>

    <tr>

    <td><asp:TextBox ID="txtNewContactName" runat="server"></asp:TextBox></td>

    </tr>

    <tr>

    <td><asp:Button id="btnSave" runat="server" Text="Save" CausesValidation="true" OnClick="BtnSave_Click" />&nbsp;&nbsp;

    <asp:Button ID="btnClose" runat="server" Text="Cancel" CausesValidation="false" /></td>

    </tr>

    </table>

    </ContentTemplate>

    </asp:UpdatePanel>

    </asp:Panel>

    </div>

    </form>

    </body>

    </html>

    Sincerely,
    Vinay Kumar Gupta

    Code Review Service || Join now: CodeASP.NET Community || Recent Blogs postings || new forum

    Please mark the most helpful reply/replies as "Answer".
  • Re: PLease tell me why the modalpopupextender control won't show

    03-01-2009, 9:59 AM
    • Member
      12 point Member
    • dvn
    • Member since 02-18-2009, 3:59 PM
    • Posts 27

    thank you for the suggestion but it did not make any difference. The PopUp still not showing.

Page 1 of 1 (3 items)