ASP.NET Webform填充后台代码的引导程序模式
[英]ASP.NET Webform fill bootstrap modal from code behind
问题描述
I have a gridview in my page, and when Edit button is clicked, it will display a bootstrap modal, named modalEditPurchase , and display data. 
我的页面中有一个gridview，单击“编辑”按钮时，它将显示一个名为modalEditPurchase的引导模式，并显示数据。 I have tried to populate the fields in the modal from code-behind but it didn't work, the fields are not populated. 我试图从代码的后面填充模式中的字段，但是它不起作用，没有填充字段。
Can anyone advise what I did wrong? 谁能告诉我我做错了什么？
Thank you in advance. 先感谢您。
HTML 的HTML
<div class="form-group">
<div class="col-md-2">
<a id="hypAddPurchase" data-toggle="modal" data-target="#modalAddPurchase" class="btn btn-primary" <%--style="float: left;"--%>>
<span class="glyphicon glyphicon-plus"></span> Add Purchase
</a>
</div>
</div>
<div class="form-group">
<div class="col-md-11">
<div class="container">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="gvDetails" runat="server" AutoGenerateColumns="false" CssClass="table table-bordered table-hover"
DataKeyNames="ID">
<Columns>
<asp:BoundField DataField="ID" HeaderText="Id" />
<asp:BoundField DataField="PRODUCT_CODE" HeaderText="Fund Code" />
<asp:BoundField DataField="PRODUCT_NAME" HeaderText="Fund Name" />
<asp:BoundField DataField="" HeaderText="Fund Currency" />
<asp:BoundField DataField="INVEST_AMT" HeaderText="Amount Invest" />
<asp:BoundField DataField="" HeaderText="Payment Currency" />
<asp:BoundField DataField="ENTRY_FEE_RATE" HeaderText="Entry Fee %" />
<asp:BoundField DataField="ENTRY_FEE_AMT" HeaderText="Entry Fee Amount" />
<asp:BoundField DataField="GST_RATE" HeaderText="GST %" />
<asp:BoundField DataField="GST_AMT" HeaderText="GST Amount" />
<asp:BoundField DataField="TRANS_AMT" HeaderText="Transaction Amount" />
<asp:BoundField DataField="FX_RATE" HeaderText="FX Rate" Visible="False" />
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton runat="server" CommandName="Edit" data-toggle="modal" data-target="#modalEditPurchase" CssClass="btn btn-primary btn-sm" OnClick="OpenEdit_OnClick"><span class="glyphicon glyphicon-pencil"></span> Edit</asp:LinkButton>
<asp:LinkButton runat="server" CommandName="Delete" CssClass="btn btn-primary btn-sm"><span class="glyphicon glyphicon-minus"></span> Delete</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnAdd" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</div>
</div>
</div>
<div class="modal fade" id="modalEditPurchase" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="modalEditPurchaseLabel">Edit Purchase</h4>
</div>
<div class="modal-body">
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Fund:</label>
</div>
<div class="col-md-5">
<asp:DropDownList class="form-control chosen-select_inModal" ID="ddlFundEdit" Width="400" runat="server"></asp:DropDownList>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Fund Currency:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" ID="txtFundCurrencyEdit" CssClass="form-control"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Amount Invest:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtAmountInvestEdit" CssClass="form-control" placeholder="00.00"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Payment Currency:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtPaymentCurrencyEdit" CssClass="form-control" placeholder="Payment Currency"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">FX Rate:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtFxRateEdit" CssClass="form-control" placeholder ="FX Rate"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Entry Fee %:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtEntryFeeRateEdit" CssClass="form-control" placeholder="Entry Fee Rate %"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Entry Fee:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtEntryFeeAmtEdit" CssClass="form-control" placeholder="00.00"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">GST %:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtGstRateEdit" CssClass="form-control" placeholder="GST Rate %"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">GST Amount:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtGstAmtEdit" CssClass="form-control" placeholder="00.00"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Trans Amount:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtTransAmtEdit" CssClass="form-control" placeholder="00.00"></asp:TextBox>
</div>
</ul>
</div>
<div class="modal-footer">
<asp:Button runat="server" CssClass="btn btn-primary" ID="btnEdit" Text="Update" UseSubmitBehavior="false" OnClick="btnEdit_Click"/>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modalAddPurchase" tabindex="-1" role="dialog">
<div class="modal-dialog" style="width: 768px;">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="modalAddPurchaseLabel">Add Purchase</h4>
</div>
<div class="modal-body">
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Fund:</label>
</div>
<div class="col-md-5">
<asp:DropDownList class="form-control chosen-select_inModal" ID="ddlFundAdd" Width="400" runat="server"></asp:DropDownList>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Fund Currency:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" ID="txtFundCurrencyAdd" CssClass="form-control"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Amount Invest:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtAmountInvestAdd" CssClass="form-control" placeholder="Amount Invest"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Payment Currency:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtPaymentCurrencyAdd" CssClass="form-control" placeholder="Payment Currency"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">FX Rate:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtFxRateAdd" CssClass="form-control" placeholder ="FX Rate"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Entry Fee %:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtEntryFeeRateAdd" CssClass="form-control"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Entry Fee:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtEntryFeeAmtAdd" CssClass="form-control"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">GST %:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtGstRateAdd" CssClass="form-control"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">GST Amount:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtGstAmtAdd" CssClass="form-control"></asp:TextBox>
</div>
</ul>
<ul class="row">
<div class="col-md-4" align="right">
<label class="control-label">Trans Amount:</label>
</div>
<div class="col-md-5">
<asp:TextBox runat="server" id="txtTransAmtAdd" CssClass="form-control" placeholder="Transaction Amount"></asp:TextBox>
</div>
</ul>
</div>
<div class="modal-footer">
<asp:Button runat="server" CssClass="btn btn-primary" ID="btnAdd" Text="Add" UseSubmitBehavior="false" OnClick="btnAdd_Click" data-dismiss="modal"/>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
C# C＃
protected void OpenEdit_OnClick(object sender, EventArgs e)
{
if (gvDetails.Rows.Count > 0)
{
GridViewRow row = gvDetails.SelectedRow;
ddlFundEdit.SelectedValue = row.Cells[1].Text;
txtFundCurrencyEdit.Text = row.Cells[3].Text;
txtAmountInvestEdit.Text = row.Cells[4].Text;
txtPaymentCurrencyEdit.Text = row.Cells[5].Text;
txtEntryFeeRateEdit.Text = row.Cells[6].Text;
txtEntryFeeAmtEdit.Text = row.Cells[7].Text;
txtGstRateEdit.Text = row.Cells[8].Text;
txtGstAmtEdit.Text = row.Cells[9].Text;
txtTransAmtEdit.Text = row.Cells[10].Text;
txtFxRateEdit.Text = row.Cells[11].Text;
}
}
protected void btnAdd_Click(object sender, EventArgs e)
{
int rowIndex = 0;
DataTable dtCurrentTable = new DataTable();
DataRow drCurrentRow = null;
if (ViewState["CurrentTable"] != null)
{
dtCurrentTable = (DataTable) ViewState["CurrentTable"];
if (dtCurrentTable.Rows.Count > 0)
{
for (int i = 1; i <= dtCurrentTable.Rows.Count; i++)
{
// Extract current values in table
string id = gvDetails.Rows[rowIndex].Cells[0].Text;
string fund = gvDetails.Rows[rowIndex].Cells[1].Text;
string fundName = gvDetails.Rows[rowIndex].Cells[2].Text;
string fundCurrency = gvDetails.Rows[rowIndex].Cells[3].Text;
string amountInvest = gvDetails.Rows[rowIndex].Cells[4].Text;
string paymentCurrency = gvDetails.Rows[rowIndex].Cells[5].Text;
string entryFeeRate = gvDetails.Rows[rowIndex].Cells[6].Text;
string entryFeeAmount = gvDetails.Rows[rowIndex].Cells[7].Text;
string gstRate = gvDetails.Rows[rowIndex].Cells[8].Text;
string gstAmount = gvDetails.Rows[rowIndex].Cells[9].Text;
string transactionAmount = gvDetails.Rows[rowIndex].Cells[10].Text;
string fxRate = gvDetails.Rows[rowIndex].Cells[11].Text;
dtCurrentTable.Rows[i - 1]["ID"] = id;
dtCurrentTable.Rows[i - 1]["PRODUCT_CODE"] = fund;
dtCurrentTable.Rows[i - 1]["PRODUCT_NAME"] = fundName;
dtCurrentTable.Rows[i - 1]["FUND_CURRENCY"] = fundCurrency;
dtCurrentTable.Rows[i - 1]["INVEST_AMT"] = amountInvest;
dtCurrentTable.Rows[i - 1]["PAYMENT_CURRENCY"] = paymentCurrency;
dtCurrentTable.Rows[i - 1]["ENTRY_FEE_RATE"] = entryFeeRate;
dtCurrentTable.Rows[i - 1]["ENTRY_FEE_AMT"] = entryFeeAmount;
dtCurrentTable.Rows[i - 1]["GST_RATE"] = gstRate;
dtCurrentTable.Rows[i - 1]["GST_AMT"] = gstAmount;
dtCurrentTable.Rows[i - 1]["TRANS_AMT"] = transactionAmount;
dtCurrentTable.Rows[i - 1]["FX_RATE"] = fxRate;
rowIndex++;
}
}
}
else
{
dtCurrentTable.Columns.Add("ID", typeof(string));
dtCurrentTable.Columns.Add("PRODUCT_CODE", typeof(string));
dtCurrentTable.Columns.Add("PRODUCT_NAME", typeof(string));
dtCurrentTable.Columns.Add("FUND_CURRENCY", typeof(string));
dtCurrentTable.Columns.Add("INVEST_AMT", typeof(string));
dtCurrentTable.Columns.Add("PAYMENT_CURRENCY", typeof(string));
dtCurrentTable.Columns.Add("ENTRY_FEE_RATE", typeof(string));
dtCurrentTable.Columns.Add("ENTRY_FEE_AMT", typeof(string));
dtCurrentTable.Columns.Add("GST_RATE", typeof(string));
dtCurrentTable.Columns.Add("GST_AMT", typeof(string));
dtCurrentTable.Columns.Add("TRANS_AMT", typeof(string));
dtCurrentTable.Columns.Add("FX_RATE", typeof(string));
}
drCurrentRow = dtCurrentTable.NewRow();
drCurrentRow["ID"] = rowIndex + 1;
drCurrentRow["PRODUCT_CODE"] = ddlFundAdd.SelectedValue;
drCurrentRow["PRODUCT_NAME"] = ddlFundAdd.SelectedItem.Text;
drCurrentRow["FUND_CURRENCY"] = txtFundCurrencyAdd.Text;
drCurrentRow["INVEST_AMT"] = txtAmountInvestAdd.Text;
drCurrentRow["PAYMENT_CURRENCY"] = txtPaymentCurrencyAdd.Text;
drCurrentRow["ENTRY_FEE_RATE"] = txtEntryFeeRateAdd.Text;
drCurrentRow["ENTRY_FEE_AMT"] = txtEntryFeeAmtAdd.Text;
drCurrentRow["GST_RATE"] = txtGstRateAdd.Text;
drCurrentRow["GST_AMT"] = txtGstAmtAdd.Text;
drCurrentRow["TRANS_AMT"] = txtTransAmtAdd.Text;
drCurrentRow["FX_RATE"] = txtFxRateAdd.Text;
dtCurrentTable.Rows.Add(drCurrentRow);
ViewState["CurrentTable"] = dtCurrentTable;
BindGrid();
}
protected void BindGrid()
{
if (ViewState["CurrentTable"] != null)
{
gvDetails.DataSource = ViewState["CurrentTable"] as DataTable;
}
else
{
gvDetails.DataSource = null;
}
gvDetails.DataBind();
}
3 个解决方案
解决方案1
1 2016-11-28 07:02:44
Everything should be inside the asp:UpdatePanel tag, even the modal <div class="modal fade" ...> . 一切都应该在asp:UpdatePanel标记内，甚至是模态<div class="modal fade" ...> 。 That should work. 那应该工作。
That's the way UpdatePanels work: when a server call is triggered , only their ContentTemplate area is updated (even when you try to update other parts of the page). 这就是UpdatePanels的工作方式： 触发服务器调用时，仅更新其ContentTemplate区域（即使尝试更新页面的其他部分）。
EDIT 编辑
I think there's a problem with the UpdatePanel's trigger: it should be directed to the grid's click event, but currently it doesn't seem to be the case. 我认为UpdatePanel的触发器存在问题：应将其定向到网格的click事件，但目前看来并非如此。
The Edit button already has a command configured: CommandName="Edit" , so you need to capture the OnRowCommand event of the grid, like this: “编辑”按钮已经配置了一个命令： CommandName="Edit" ，因此您需要捕获网格的OnRowCommand事件，如下所示：
<asp:GridView ID="gvDetails" ... OnRowCommand="grid_RowCommand">
also change the UpdatePanel's trigger, like this: 还可以更改UpdatePanel的触发器，如下所示：
<asp:AsyncPostBackTrigger ControlID="gvDetails" EventName="OnRowCommand" />
and in code behind: 并在后面的代码中：
protected void grid_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "Edit")
{
// your current OpenEdit_OnClick code
}
}
解决方案2
0 2016-11-28 07:05:10
GridViewRow row = (sender as LinkButton).NamingContainer as GridViewRow;
现在从行中获取数据。
解决方案3
0 已采纳 2016-12-29 03:14:48
Just to update and let you know that I have managed to solve this issue earlier. 只是进行更新，让您知道我已经设法解决了这个问题。
1) I changed the LinkButton in the gridview to Button 1）我将gridview中的LinkButton更改为Button
2) Added this in the OnEdit_Click: 2）在OnEdit_Click中添加了它：
Button btn = sender as Button;
GridViewRow row = btn.NamingContainer as GridViewRow;
string id = gvDetails.DataKeys[row.RowIndex].Values[0].ToString();
3) Put modalEditPurchase inside an UpdatePanel 3）将modalEditPurchase放在UpdatePanel中
4) Populate the modalEditPurchase using the id. 4）使用ID填充modalEditPurchase。
Thank you everyone for your help. 感谢大家的帮助。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
Bootstrap 5 显示模态代码（Asp.net C#） - Bootstrap 5 Show Modal Code Behind (Asp.net C#)
使用具有Bootstrap模态的asp.net Webform ValidationSummary - Using an asp.net webform ValidationSummary with bootstrap modal
ASP.NET模式弹出窗口，完全来自代码背后？ - ASP.NET modal popup, entirely from code behind?
C＃asp.net WebForm添加JS并从后面的代码运行 - C# asp.net WebForm add JS and run it from code behind
带有Bootstrap弹出模式和内容页面的ASP.Net MasterPage，其代码后面 - ASP.Net MasterPage with Bootstrap Popup Modal & Content Pages With Code Behind
如何从asp.net中的模式对话框访问click事件代码背后的代码 - How to access the code behind click event code from a modal dialog box in asp.net
如何从asp.net代码后面打开Colorbox jquery插件模式窗口？ - How to open Colorbox jquery plugin modal window from asp.net code behind?
如何将javascript方法（JSON对象）的结果发送到asp.net Webform上的隐藏代码？ - How do I send the results of a javascript method (JSON object) to the code-behind on asp.net webform?
twitter bootstrap，html控件和asp.net代码背后 - twitter bootstrap, html controls and asp.net code behind
在asp.net后面的代码中获取引导程序dateTimePicker值 - Get bootstrap dateTimePicker value in code behind asp.net
相关标签