如何在GridView中使用ModalPopUpExtender? [英] How to use ModalPopUpExtender in GridView?

问题描述

我的数据库中有以下表格:

** SuggestionsLog表:** ID，标题，描述.

**员工表:**用户名，名称

**部门表:**部门代码，部门名称

我只想显示一个仅由SuggestationID，SuggestionTitle，EmployeeName和DivisionName组成的表，当用户单击SuggestionTitle时，将显示一个弹出窗口，其中包含建议的描述.

由于我是ASP.NET初学者开发人员，因此我尝试按照其中一个教程进行操作，但失败了.

我的工作如下:

** ASP.NET代码:**

I have following tables in my database:

**SuggestionsLog Table:** ID, Title, Description.

**Employee Table:** Username, Name

**Divisions Table:** DivisionCode, DivisionName

I want to show table that consists of SuggestionID, SuggestionTitle, EmployeeName and DivisionName only and when the user clicks on the SuggestionTitle, a pop-up window will be displayed with the description of the suggestion.

Since I am ASP.NET beginner developer, I tried to follow one of the tutorials to get it but I failed.

What I did is the following:

**ASP.NET Code:**

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:GridView ID="GridView1" runat="server" AllowPaging="True"
            AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="ID"
            DataSourceID="SqlDataSource1" OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False"
                    ReadOnly="True" SortExpression="ID" />
                <asp:TemplateField HeaderText="Title">
                    <ItemTemplate>
                        <asp:LinkButton runat="server" ID="lnkSuggestionTitle"
                                        Text=''<%#Eval("Title") %>''
                                        OnClick="lnkSuggestionTitle_Click">
                                        </asp:LinkButton>
                    </ItemTemplate>
                </asp:TemplateField>
                <%--<asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" />--%>
                <asp:BoundField DataField="Description" HeaderText="Description"
                    SortExpression="Description" />
                <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
                <asp:BoundField DataField="Username" HeaderText="Username"
                    SortExpression="Username" />
                <asp:BoundField DataField="DivisionName" HeaderText="Division"
                    SortExpression="DivisionName" />
            </Columns>
        </asp:GridView>

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

        <AjaxToolkit:ModalPopupExtender ID="modalPopUpExtender1"
                                         runat="server" TargetControlID="btnModalPopUp" PopupControlID="pnlPopUp" BackgroundCssClass="modalBackground"
                                        OkControlID="btnOk" X="20" Y="100">
        </AjaxToolkit:ModalPopupExtender>

        <asp:Panel runat="server" ID="pnlPopUp" CssClass="confirm-dialog">
            <asp:GridView ID="GridView2" runat="server">
            </asp:GridView>
        </asp:Panel>

        </ContentTemplate>
        </asp:UpdatePanel>
        <br />

        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
            ConnectionString="<%$ ConnectionStrings:testConnectionString %>"
            SelectCommand="SELECT     dbo.SafetySuggestionsLog.ID, dbo.SafetySuggestionsLog.Title, dbo.SafetySuggestionsLog.Description, dbo.employee.Name, dbo.SafetySuggestionsLog.Username,
                      dbo.Divisions.DivisionName
FROM         dbo.employee INNER JOIN
                      dbo.SafetySuggestionsLog ON dbo.employee.Username = dbo.SafetySuggestionsLog.Username INNER JOIN
                      dbo.Divisions ON dbo.employee.DivisionCode = dbo.Divisions.SapCode">
        </asp:SqlDataSource>

**隐藏代码:**

**Code-Behind:**

protected void lnkSuggestionTitle_Click(object sender, EventArgs e)
    {
        LinkButton lnkSuggestionTitle = sender as LinkButton;
        string strSuggestionTitle = lnkSuggestionTitle.Text;

        string strConnectionString = ConfigurationManager.ConnectionStrings["testConnectionString"].ConnectionString;
        string strSelect = "SELECT ID, Title, Description FROM  dbo.SafetySuggestionsLog";
        SqlConnection sqlCon = new SqlConnection();
        sqlCon.ConnectionString = strConnectionString;
        SqlCommand cmdSuggestionDetails = new SqlCommand();
        cmdSuggestionDetails.Connection = sqlCon;
        cmdSuggestionDetails.CommandType = System.Data.CommandType.Text;
        cmdSuggestionDetails.CommandText = strSelect;
        cmdSuggestionDetails.Parameters.AddWithValue("@Title", strSuggestionTitle);
        sqlCon.Open();

        SqlDataReader dReader = cmdSuggestionDetails.ExecuteReader();
        GridView1.DataSource = dReader;
        GridView1.DataBind();
        sqlCon.Close();
        modalPopUpExtender1.Show();
    }

一切都进行得很顺利，但是在网站上，当我单击其中一个标题时，我没有得到ModalPopUp.另外，我在Internet Explorer浏览器的左下角收到一条错误通知，当我打开它时，它给出了以下描述:

**

Sys.ArgumentNullException:值不能为null.参数名称:elements

**

我不知道为什么会这样.请帮忙吗?

Everything is going well and smooth, but in the website, when I clicked on one of the titles, I did not get the ModalPopUp. Also, I got an error notification at the left bottom corner in the Internet Explorer browser, which when I opened it, it gave me the following description:

**

Sys.ArgumentNullException: Value cannot be null. Parameter name: elements

**

I don''t know why this is happened. Any help please?

推荐答案

ConnectionStrings:testConnectionString％> SelectCommand ="SELECT dbo.SafetySuggestionsLog.ID，dbo.SafetySuggestionsLog.Title，dbo.SafetySuggestionsLog.Description，dbo.employee.Name，dbo.SafetySuggestionsLog.Username， dbo.Divisions.DivisionName 来自dbo.employee内部联接 dbo.SafetySuggestionsLog on dbo.employee.Username = dbo.SafetySuggestionsLog.Username内联接 在dbo.employee.DivisionCode = dbo.Divisions.SapCode上打开dbo.Divisions. </asp:SqlDataSource>

ConnectionStrings:testConnectionString %>" SelectCommand="SELECT dbo.SafetySuggestionsLog.ID, dbo.SafetySuggestionsLog.Title, dbo.SafetySuggestionsLog.Description, dbo.employee.Name, dbo.SafetySuggestionsLog.Username, dbo.Divisions.DivisionName FROM dbo.employee INNER JOIN dbo.SafetySuggestionsLog ON dbo.employee.Username = dbo.SafetySuggestionsLog.Username INNER JOIN dbo.Divisions ON dbo.employee.DivisionCode = dbo.Divisions.SapCode"> </asp:SqlDataSource>

**隐藏代码:**

**Code-Behind:**

protected void lnkSuggestionTitle_Click(object sender, EventArgs e)
    {
        LinkButton lnkSuggestionTitle = sender as LinkButton;
        string strSuggestionTitle = lnkSuggestionTitle.Text;

        string strConnectionString = ConfigurationManager.ConnectionStrings["testConnectionString"].ConnectionString;
        string strSelect = "SELECT ID, Title, Description FROM  dbo.SafetySuggestionsLog";
        SqlConnection sqlCon = new SqlConnection();
        sqlCon.ConnectionString = strConnectionString;
        SqlCommand cmdSuggestionDetails = new SqlCommand();
        cmdSuggestionDetails.Connection = sqlCon;
        cmdSuggestionDetails.CommandType = System.Data.CommandType.Text;
        cmdSuggestionDetails.CommandText = strSelect;
        cmdSuggestionDetails.Parameters.AddWithValue("@Title", strSuggestionTitle);
        sqlCon.Open();

        SqlDataReader dReader = cmdSuggestionDetails.ExecuteReader();
        GridView1.DataSource = dReader;
        GridView1.DataBind();
        sqlCon.Close();
        modalPopUpExtender1.Show();
    }

一切都进行得很顺利，但是在网站上，当我单击其中一个标题时，我没有得到ModalPopUp.另外，我在Internet Explorer浏览器的左下角收到一条错误通知，当我打开它时，它给出了以下描述:

**

Sys.ArgumentNullException:值不能为null.参数名称:elements

**

我不知道为什么会这样.有任何帮助吗?

Everything is going well and smooth, but in the website, when I clicked on one of the titles, I did not get the ModalPopUp. Also, I got an error notification at the left bottom corner in the Internet Explorer browser, which when I opened it, it gave me the following description:

**

Sys.ArgumentNullException: Value cannot be null. Parameter name: elements

**

I don''t know why this is happened. Any help please?

我已更正了您的代码.纠正措施是将modalpopupextender和Panel放置在同一< itemtemplate ...>中的TargetControlId旁边.这样每个LinkBut​​ton都会有自己的弹出窗口.

I have corrected your code. The correction is to place the modalpopupextender and Panel just beside the TargetControlId in the same <itemtemplate...> so that each LinkButton will have its own Popup.

<asp:updatepanel id="UpdatePanel1" runat="server" xmlns:asp="#unknown">
        <contenttemplate>
            <asp:gridview id="GridView1" runat="server" allowpaging="True">
                AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="ID" 
                DataSourceID="SqlDataSource1" OnRowDataBound="GridView1_RowDataBound">
                <columns>
                    <asp:boundfield datafield="ID" headertext="ID" insertvisible="False">
                        ReadOnly="True" SortExpression="ID" />
                    <asp:templatefield headertext="Title">
                        <itemtemplate>
                            <asp:linkbutton runat="server" id="lnkSuggestionTitle">
                                            Text='<%#Eval("Title") %>' 
                                            OnClick="lnkSuggestionTitle_Click">
                                            </asp:linkbutton>
<ajaxtoolkit:modalpopupextender id="modalPopUpExtender1" xmlns:ajaxtoolkit="#unknown">
                                             runat="server" TargetControlID="lnkSuggestionTitle" PopupControlID="pnlPopUp" BackgroundCssClass="modalBackground" 
                                            OkControlID="btnOk" X="20" Y="100">
            </ajaxtoolkit:modalpopupextender>
    
            <asp:panel runat="server" id="pnlPopUp" cssclass="confirm-dialog">
                <asp:gridview id="GridView2" runat="server">
                </asp:gridview>
            </asp:panel>
                        </itemtemplate>
                    </asp:templatefield>
                    <%--<asp:boundfield datafield="Title" headertext="Title" sortexpression="Title" />--%>
                    <asp:boundfield datafield="Description" headertext="Description">
                        SortExpression="Description" />
                    <asp:boundfield datafield="Name" headertext="Name" sortexpression="Name" />
                    <asp:boundfield datafield="Username" headertext="Username">
                        SortExpression="Username" />
                    <asp:boundfield datafield="DivisionName" headertext="Division">
                        SortExpression="DivisionName" />
                </asp:boundfield></asp:boundfield></asp:boundfield></asp:boundfield></columns>
            </asp:gridview>
            
            </contenttemplate>
            </asp:updatepanel>
            <br /> 
    
            <asp:sqldatasource id="SqlDataSource1" runat="server" xmlns:asp="#unknown">
                ConnectionString="<%

ConnectionStrings:testConnectionString％>" SelectCommand ="SELECT dbo.SafetySuggestionsLog.ID，dbo.SafetySuggestionsLog.Title，dbo.SafetySuggestionsLog.Description，dbo.employee.Name，dbo.SafetySuggestionsLog.Username， dbo.Divisions.DivisionName 来自dbo.employee内部联接 dbo.SafetySuggestionsLog on dbo.employee.Username = dbo.SafetySuggestionsLog.Username内联接 在dbo.employee.DivisionCode = dbo.Divisions.SapCode上打开dbo.Divisions. < /asp:sqldatasource >

ConnectionStrings:testConnectionString %>" SelectCommand="SELECT dbo.SafetySuggestionsLog.ID, dbo.SafetySuggestionsLog.Title, dbo.SafetySuggestionsLog.Description, dbo.employee.Name, dbo.SafetySuggestionsLog.Username, dbo.Divisions.DivisionName FROM dbo.employee INNER JOIN dbo.SafetySuggestionsLog ON dbo.employee.Username = dbo.SafetySuggestionsLog.Username INNER JOIN dbo.Divisions ON dbo.employee.DivisionCode = dbo.Divisions.SapCode"> </asp:sqldatasource>

这篇关于如何在GridView中使用ModalPopUpExtender?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！