在jQuery Modal Window中显示来自代码的数据

时间:2014-08-07 00:43:40

标签: c# jquery asp.net modal-dialog code-behind

在按钮上单击我从asp.net c#

中的代码打开一个jQuery模式窗口
    protected void btnShowModal_Click(object sender, EventArgs e)
    {
        ScriptManager.RegisterStartupScript(this, GetType(), "Show Modal Popup", "showmodalpopup();", true);
    }

这是jquery:

<script type="text/javascript">
function showmodalpopup() {
    $("#popupdiv").dialog({
        title: "Personal Information",
        width: 500,
        height: 450,
        modal: true,
        buttons: {
            Close: function () {
                $(this).dialog('close');
            }
        }
    });
};

这是html:

<div id="popupdiv" title="Basic modal dialog" style="display: none">
First Name:<br />
Last Name:<br />
Agent No:<br />
Phone:<br />
Email:<br />
Address 1:<br />
Address 2:<br />
City:<br />
State:<br />
Zip:<br />
</div>
<asp:Button ID="btnShowModal" runat="server" Text="Contact Information" OnClick="btnShowModal_Click" /> <asp:Button ID="Messages" runat="server" Text="Inbox" OnClick="btnShowModal_Click" />

在后面的代码中,我有从db。

加载的数据
            string lastName = tbl.Rows[0]["lastname"].ToString();
            string fullName = tbl.Rows[0]["FullName"].ToString();
            string Phone = tbl.Rows[0]["phone"].ToString();
            string email = tbl.Rows[0]["email"].ToString();
            string address1 = tbl.Rows[0]["address1"].ToString();
            string address2 = tbl.Rows[0]["address2"].ToString();
            string city = tbl.Rows[0]["city"].ToString();
            string State = tbl.Rows[0]["State"].ToString();
            string Zip = tbl.Rows[0]["Zip"].ToString();

我想要完成的是从后面的代码中显示从模式窗口中的数据库中获取的数据。 这里的联系信息是硬编码的。这只是为了展示一个例子。

谢谢。

enter image description here

1 个答案:

答案 0 :(得分:3)

为模态代码中的每个值添加Label,如下所示:

<div id="popupdiv" title="Basic modal dialog" style="display: none">
    First Name: <asp:Label ID="lblFirstName" runat="server" Text=""></asp:Label><br />
    Last Name: <asp:Label ID="lblLastName" runat="server" Text=""></asp:Label><br />
    Agent No: <asp:Label ID="lblAgentNo" runat="server" Text=""></asp:Label><br />
    Phone: <asp:Label ID="lblPhine" runat="server" Text=""></asp:Label><br />
    Email: <asp:Label ID="lblEmail" runat="server" Text=""></asp:Label><br />
    Address 1: <asp:Label ID="lblAddress1" runat="server" Text=""></asp:Label><br />
    Address 2: <asp:Label ID="lblAddress2" runat="server" Text=""></asp:Label><br />
    City: <asp:Label ID="lblCity" runat="server" Text=""></asp:Label><br />
    State: <asp:Label ID="lblState" runat="server" Text=""></asp:Label><br />
    Zip: <asp:Label ID="lblZip" runat="server" Text=""></asp:Label><br />
</div>


然后在CodeBehind中为此标签设置值:

protected void btnShowModal_Click(object sender, EventArgs e)
{
    ScriptManager.RegisterStartupScript(this, GetType(), "Show Modal Popup", "showmodalpopup();", true);
    string firstName = tbl.Rows[0]["firstName"].ToString();
    string lastName = tbl.Rows[0]["lastName"].ToString();
    //
    //
    // and so on

    lblFirstName.Text = firstName;
    lblLastName.Text = lastName;
    //
    //
    // and so on
}