Display data from code in jQuery modal window
On button click I open jQuery modal window from code in asp.net C #
protected void btnShowModal_Click(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, GetType(), "Show Modal Popup", "showmodalpopup();", true);
}
Here's the jquery:
<script type="text/javascript">
function showmodalpopup() {
$("#popupdiv").dialog({
title: "Personal Information",
width: 500,
height: 450,
modal: true,
buttons: {
Close: function () {
$(this).dialog('close');
}
}
});
};
Here's the 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" />
In the code behind I have data loaded from 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();
What I am trying to accomplish is display the data grabbed from the database in a modal window from the code behind. Contact information is hardcoded here. This is just to show an example.
Thank.
+3
source to share
1 answer
Place an a Label
for each value in your modal code like:
<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>
Then, in CodeBehind, set a value for these labels:
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
}
+3
source to share