3 Replies - 5493 Views - Last Post: 17 May 2011 - 01:51 PM Rate Topic: -----

#1 tkksnow   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 26-April 11

ASP & ModalPopupExtender - Not loading twice on Firefox

Posted 16 May 2011 - 05:01 PM

Hello,

I'm having an issue with a modalpopupextender not working twice in Firefox 4.0.1 (popup works fine multiple times in IE). The fire popup fires fine in FF, when I hit the popup window cancel, and try to open another popup, no event occurs. Hoping this is a quick fix and has to do with firefox's cache system. Any help would be great or a point in the right direction.


Chunk of the ASP:

   
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
<asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1" 
                AllowPaging="True" 
                AllowSorting="True" CellPadding="4" 
                ForeColor="#333333" Width="1000px"  GridLines="None" 
                ToolTip="Achievements By Departments" AutoGenerateColumns="False">
                <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#bfcbd6" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />


<Columns>       
    
     <asp:TemplateField HeaderText="Full Name">
        <ItemTemplate>
                <asp:LinkButton runat="server" ID="lnkCustDetails" Text='<%# Eval("user_fullname") %>'  onclick="lnkCustDetails_Click" />
        </ItemTemplate>
    </asp:TemplateField>
  
</Columns>
</asp:GridView>
        
<asp:Button runat="server" ID="btnShowModalPopup" style="display:none"/>
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" 
    TargetControlID="btnShowModalPopup"
    PopupControlID="divPopUp" 
    BackgroundCssClass="popUpStyle" 
    PopupDragHandleControlID="panelDragHandle"
    DropShadow="true"
    
    />
<br />

<div class="popUpStyle" id="divPopUp" style="display:none;">
    <asp:Panel runat="Server" ID="panelDragHandle" CssClass="drag">
        Hold here to Drag this Box
    </asp:Panel>
    <asp:Label runat="server" ID="lblText" Text="Full Name: "></asp:Label>
    <asp:Label ID="lblNameValue" runat="server"></asp:Label>
        
        <asp:GridView ID="GridView2" runat="server">
              <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#bfcbd6" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
        </asp:GridView>                          

    <asp:Button ID="btnClose"  onclick="Clear_Click" runat="server" Text="Close" />
   <br />
</div>        
    </ContentTemplate>
    </asp:UpdatePanel>   
    
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
        ConnectionString="<%$ ConnectionStrings:intranetConnectionString %>" 
        SelectCommand="USE FADB SELECT user_fullname FROM dbo.hnu_users"></asp:SqlDataSource>        
    
  



The .CS



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.DirectoryServices;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using AjaxControlToolkit;
using System.Text;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;


namespace WebApplication2
{
    public partial class FADB_Detail: System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

            if (!Page.IsPostBack)
            {
                BindDropDownListData();
                BindDropDownListData_Dept();
             
            }
        }







        public void BindDropDownListData()
        {
            string connectionString = ConfigurationManager.ConnectionStrings["intranetConnectionString"].ConnectionString;

            using (SqlConnection mySqlConnection = new SqlConnection(connectionString))
            {
                try
                {
                    // open the Sql connection
                    mySqlConnection.Open();

                    // Sql Command object initialized with SQL query to retrieve the categories
                    SqlCommand mySqlCommand = new SqlCommand("USE FADB SELECT user_fullname FROM dbo.hnu_users", mySqlConnection);

                    SqlDataAdapter mySqlDataAdapter = new SqlDataAdapter(mySqlCommand);

                    DataSet myDataSet = new DataSet();

                    mySqlDataAdapter.Fill(myDataSet);

                    ddl_name.DataSource = myDataSet;

                    ddl_name.DataTextField = "user_fullname";

                    ddl_name.DataValueField = "user_fullname";

                    ddl_name.DataBind();

                }
                catch (Exception ex)
                {
                    ddl_name_label.Text = ex.Message;
                }
                finally
                {
                    // close the Sql Connection
                    mySqlConnection.Close();
                }
            }
        }





        protected void Clear_Click(object sender, EventArgs e)
        {

            ModalPopupExtender1.Hide();
            
                        
            
        }




        protected void lnkCustDetails_Click(object sender, EventArgs e)
        {
            // Fetch the customer id
            
            LinkButton lb = sender as LinkButton;
            string Name = lb.Text;
            lblNameValue.Text = Name;
            
            // Connection
            string constr = System.Web.Configuration.WebConfigurationManager.ConnectionStrings["intranetConnectionString"].ConnectionString;
            string sql = "USE FADB SELECT user_email FROM dbo.hnu_users WHERE user_fullname = @Name";
            SqlConnection connection = new SqlConnection(constr);
            SqlCommand cmd = new SqlCommand(sql, connection);
            cmd.Parameters.AddWithValue("@Name", Name);
            cmd.CommandType = CommandType.Text;
            connection.Open();
            SqlDataReader dr = cmd.ExecuteReader();
            
            // Bind the reader to the GridView
            // You can also use a lighter control 
            // like the Repeater to display data
            GridView2.DataSource = dr;
            GridView2.DataBind();
            connection.Close();
            
            
            // Show the modalpopupextender
            ModalPopupExtender1.Show();
            

        }




        public void BindDropDownListData_Dept()
        {
            string connectionString = ConfigurationManager.ConnectionStrings["intranetConnectionString"].ConnectionString;

            using (SqlConnection mySqlConnection = new SqlConnection(connectionString))
            {
                try
                {
                    // open the Sql connection
                    mySqlConnection.Open();

                    // Sql Command object initialized with SQL query to retrieve the categories
                    SqlCommand mySqlCommand = new SqlCommand("USE FADB SELECT DISTINCT user_dept FROM dbo.hnu_users", mySqlConnection);

                    SqlDataAdapter mySqlDataAdapter = new SqlDataAdapter(mySqlCommand);

                    DataSet myDataSet = new DataSet();

                    mySqlDataAdapter.Fill(myDataSet);

                    ddl_dept.DataSource = myDataSet;

                    ddl_dept.DataTextField = "user_dept";

                    ddl_dept.DataValueField = "user_dept";

                    ddl_dept.DataBind();

                }
                catch (Exception ex)
                {
                    ddl_dept_label.Text = ex.Message;
                }
                finally
                {
                    // close the Sql Connection
                    mySqlConnection.Close();
                }
            }
        }





























    }
}


Is This A Good Question/Topic? 0
  • +

Replies To: ASP & ModalPopupExtender - Not loading twice on Firefox

#2 Nakor   User is offline

  • Professional Lurker
  • member icon

Reputation: 448
  • View blog
  • Posts: 1,504
  • Joined: 28-April 09

Re: ASP & ModalPopupExtender - Not loading twice on Firefox

Posted 17 May 2011 - 11:21 AM

The first thing I'd try is changing the ScriptManager to a ToolkitScriptManager that comes with the Ajax Control Toolkit. This will ensure that the correct javascript libraries are getting loaded for the controls that are from the Ajax Control Toolkit.

Unfortunately I've had similar problems before and it's usually caused by the modalpopupextender being inside of the UpdatePanel. The problem I had there was no real way to separate the modalpopupextender from the updatepanel so I ended up just coding my own javascript popup instead. However, since you're main GridView, the one with the linkbutton doesn't seem to be getting updated at all on the ajax call then you could probably remove it and the modalpopupextender and still maintain the proper functionality.

I had to change the column names and the database to my test database but I was able to get it working with the following .aspx code. Also, I removed the click event from the btnClose control and instead added it as the modalpopupextender's cancel control (CancelControlID="btnClose") to avoid an unnecessary trip to the server. With the following code the gridview that appears in the popup will still be loaded asynchronously so you should still get the performance you're looking for.

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

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

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:ToolkitScriptManager ID="ScriptManager1" runat="server">
</asp:ToolkitScriptManager>

        <asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1" 
                AllowPaging="True" 
                AllowSorting="True" CellPadding="4" 
                ForeColor="#333333" Width="1000px"  GridLines="None" 
                ToolTip="Achievements By Departments" AutoGenerateColumns="False">
                <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#bfcbd6" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
            <Columns>       
    
                 <asp:TemplateField HeaderText="Full Name">
                    <ItemTemplate>
                            <asp:LinkButton runat="server" ID="lnkCustDetails" Text='<%# Eval("LastName") %>'  onclick="lnkCustDetails_Click" />
                            
                    </ItemTemplate>
                </asp:TemplateField>
  
            </Columns>
        </asp:GridView>
        
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
            SelectCommand="SELECT * FROM [Employees]"></asp:SqlDataSource>
        
<asp:Button runat="server" ID="btnShowModalPopup" style="display:none"/>

<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" 
                    TargetControlID="btnShowModalPopup"
                    PopupControlID="divPopUp" 
                    BackgroundCssClass="popUpStyle" 
                    PopupDragHandleControlID="panelDragHandle" 
                    CancelControlID="btnClose" />

<br />

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

<div class="popUpStyle" id="divPopUp" style="display:none;">
    <asp:Panel runat="Server" ID="panelDragHandle" CssClass="drag">
        Hold here to Drag this Box
    </asp:Panel>
    <asp:Label runat="server" ID="lblText" Text="Full Name: "></asp:Label>
    <asp:Label ID="lblNameValue" runat="server"></asp:Label>
        
        <asp:GridView ID="GridView2" runat="server">
              <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#bfcbd6" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
        </asp:GridView>                          

    <asp:Button ID="btnClose" runat="server" Text="Close" />
   <br />
</div>        
    </ContentTemplate>
    </asp:UpdatePanel>
    
</asp:Content>



Was This Post Helpful? 2
  • +
  • -

#3 tkksnow   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 26-April 11

Re: ASP & ModalPopupExtender - Not loading twice on Firefox

Posted 17 May 2011 - 11:50 AM

View PostNakor, on 17 May 2011 - 11:21 AM, said:

The first thing I'd try is changing the ScriptManager to a ToolkitScriptManager that comes with the Ajax Control Toolkit. This will ensure that the correct javascript libraries are getting loaded for the controls that are from the Ajax Control Toolkit.

Unfortunately I've had similar problems before and it's usually caused by the modalpopupextender being inside of the UpdatePanel. The problem I had there was no real way to separate the modalpopupextender from the updatepanel so I ended up just coding my own javascript popup instead. However, since you're main GridView, the one with the linkbutton doesn't seem to be getting updated at all on the ajax call then you could probably remove it and the modalpopupextender and still maintain the proper functionality.

I had to change the column names and the database to my test database but I was able to get it working with the following .aspx code. Also, I removed the click event from the btnClose control and instead added it as the modalpopupextender's cancel control (CancelControlID="btnClose") to avoid an unnecessary trip to the server. With the following code the gridview that appears in the popup will still be loaded asynchronously so you should still get the performance you're looking for.

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

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

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:ToolkitScriptManager ID="ScriptManager1" runat="server">
</asp:ToolkitScriptManager>

        <asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1" 
                AllowPaging="True" 
                AllowSorting="True" CellPadding="4" 
                ForeColor="#333333" Width="1000px"  GridLines="None" 
                ToolTip="Achievements By Departments" AutoGenerateColumns="False">
                <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#bfcbd6" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
            <Columns>       
    
                 <asp:TemplateField HeaderText="Full Name">
                    <ItemTemplate>
                            <asp:LinkButton runat="server" ID="lnkCustDetails" Text='<%# Eval("LastName") %>'  onclick="lnkCustDetails_Click" />
                            
                    </ItemTemplate>
                </asp:TemplateField>
  
            </Columns>
        </asp:GridView>
        
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
            SelectCommand="SELECT * FROM [Employees]"></asp:SqlDataSource>
        
<asp:Button runat="server" ID="btnShowModalPopup" style="display:none"/>

<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" 
                    TargetControlID="btnShowModalPopup"
                    PopupControlID="divPopUp" 
                    BackgroundCssClass="popUpStyle" 
                    PopupDragHandleControlID="panelDragHandle" 
                    CancelControlID="btnClose" />

<br />

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

<div class="popUpStyle" id="divPopUp" style="display:none;">
    <asp:Panel runat="Server" ID="panelDragHandle" CssClass="drag">
        Hold here to Drag this Box
    </asp:Panel>
    <asp:Label runat="server" ID="lblText" Text="Full Name: "></asp:Label>
    <asp:Label ID="lblNameValue" runat="server"></asp:Label>
        
        <asp:GridView ID="GridView2" runat="server">
              <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                <EditRowStyle BackColor="#999999" />
                <FooterStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#bfcbd6" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#bfcbd6" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
        </asp:GridView>                          

    <asp:Button ID="btnClose" runat="server" Text="Close" />
   <br />
</div>        
    </ContentTemplate>
    </asp:UpdatePanel>
    
</asp:Content>





Thank you very much! Your solution works now in all tested browsers.
Was This Post Helpful? 0
  • +
  • -

#4 Nakor   User is offline

  • Professional Lurker
  • member icon

Reputation: 448
  • View blog
  • Posts: 1,504
  • Joined: 28-April 09

Re: ASP & ModalPopupExtender - Not loading twice on Firefox

Posted 17 May 2011 - 01:51 PM

Glad it helped :)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1