GridView上的Popup引导模型使用RowCommand事件编辑点击 [英] Popup bootstrap model on GridView edit click using RowCommand event

问题描述

我有Bootstrap Model弹出窗口：

 < asp：UpdatePanel ID =upModalrunat =server> ; 
< ContentTemplate> 
 
 <！ -  Bootstrap模态对话框 - > 
< div class =modal fadeid =myModalrole =dialogaria-labelledby =myModalLabelaria-hidden =true> 
< div class =modal-dialog> 
< div class =modal-content> 
< div class =modal-header> 
< button type =buttonclass =closedata-dismiss =modalaria-hidden =true>& times;< / button> 
< h4 class =modal-title>新增BANQUET< / h4> 
< / div> 
< div class =modal-bodystyle =padding-left：0px; padding-right：0px> 
< div class =col-lg-12style =padding-left：0px; padding-right：0px> 
< div class =form-group col-lg-6> 
< label> Banquet ID：< / label> 
< asp> Label ID =lblIDCssClass =form-controlText =AUTO IDrunat =server>< / asp：Label>< / u> 
< / div> 
< div class =form-group col-lg-6> 
< label>宴会名称：< / label> 
< asp：TextBox ID =txtNameCssClass =form-controlrunat =server>< / asp：TextBox> 
< / div> 
< / div> 
 
< div class =modal-footerstyle =padding-left：0px; padding-right：0px> 
< asp：Button ID =btnSaverunat =serverOnClick =btnSave_Click
 CssClass =btn btn-success btn -lg btn-blockText =SAVEUseSubmitBehavior =假
 data-dismiss =模态/> 
< / div> 
< / div> 
< / div> 
< / div> 
< / div> 
<！ -  /.modal  - > 
 
< / ContentTemplate> 
< / asp：UpdatePanel> 
<！ -  /.upModel  - > 
  

而GridView是：

 < div class =col-lg-12 table-responsive> 
< asp：GridView ID =gvBanquetCssClass =table table-striped table-bordered table-hoverrunat =server
 AutoGenerateColumns =falseOnRowCommand =gvBanquet_RowCommandAllowPaging = TruePageSize =5
 EmptyDataText =找不到记录！ OnPageIndexChanging =gvBanquet_PageIndexChangingShowHeaderWhenEmpty =true> 
<列> 
< asp：TemplateField HeaderText =Banquet Name> 
< ItemTemplate> 
< asp：Label ID =lblIDrunat =serverVisible =falseText ='<％#Eval（bqtID）％>'>< / asp：Label> 
< asp：Label ID =lblNamerunat =serverText ='<％#Eval（bqtName）％>'>< / asp：Label> 
< / ItemTemplate> 
< / asp：TemplateField> 
 
< asp：TemplateField> 
< HeaderTemplate> 
< center>活动< / center> 
< / HeaderTemplate> 
< ItemTemplate> 
< asp：Button ID =btnEdiitrunat =serverCssClass =btn btn-danger btn-smCommandName =EditRowText =Edit/> 
< / ItemTemplate> 
< / asp：TemplateField> 
< /列> 
< HeaderStyle BackColor =＃5cb85cBorderColor =＃4CAE4CForeColor =White>< / HeaderStyle> 
 < / asp：GridView> 
< / div> 
 <！ -   -  /.col-lg-12  - > 
  

以下是RowCommand事件：

  protected void gvBanquet_RowCommand（object sender，GridViewCommandEventArgs e）
 {
 GridViewRow row =（GridViewRow）（（（Control）e.CommandSource）.NamingContainer）; 
 int index = row.RowIndex; 
 
 string id = GetTextFromGridViewLabel（gvBanquet，index，lblID）; 
 string name = GetTextFromGridViewLabel（gvBanquet，index，lblName）; 
 
 switch（e.CommandName）
 {
 caseEditRow：
 lblID.Text = id; 
 txtName.Text = name; 
休息; 
默认值：
 break; 
 
 
 
 
 $ b $ p 
 $ b 
我的问题是当我点击GridView中的Edit按钮时Bootstrap Model不会在GridView行中弹出 id 和 name 。
这里可以是一个解决方案，并按照以下步骤操作： 
 
 
 
 
在另一个UpdatePanel中。
 
 
在第一个UpdatePanel中触发GridView  RowCommand 事件 upModel ，如： 
 
 
 < ContentTemplate> 
<触发器> 
< asp：AsyncPostBackTrigger ControlID =gvBanquetEventName =RowCommand/> 
< /触发器> 
  
 
 
 
 
最后运行在 StringBuilder  RowCommand事件中的代码：
  caseEditRow：
 lblID.Text = id; 
 txtName.Text = name; 
 
 System.Text.StringBuilder sb = new System.Text.StringBuilder（）; 
 sb.Append（@< script type ='text / javascript'>）; 
 sb.Append（$（'＃myModal'）。modal（'show'）;）; 
 sb.Append（@< / script>）; 
 ScriptManager.RegisterClientScriptBlock（this，this.GetType（），MyModal，
 sb.ToString（），false）; 
 
 break; 
  
 
 
 
 
 
 
 
 
 
 
  
 
I have a Bootstrap Model popup:
<asp:UpdatePanel ID="upModal" runat="server">
<ContentTemplate>

<!-- Bootstrap Modal Dialog -->
<div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">ADD NEW BANQUET</h4>
            </div>
            <div class="modal-body" style="padding-left: 0px;padding-right:0px">
              <div class="col-lg-12" style="padding-left: 0px;padding-right:0px">
                  <div class="form-group col-lg-6">
                    <label>Banquet ID:</label>
                    <u><asp:Label ID="lblID" CssClass="form-control" Text="AUTO ID" runat="server"></asp:Label></u>
                  </div>
                  <div class="form-group col-lg-6">
                    <label>Banquet Name:</label>
                    <asp:TextBox ID="txtName" CssClass="form-control" runat="server"></asp:TextBox>
                  </div>
              </div>

            <div class="modal-footer" style="padding-left: 0px;padding-right:0px">
              <asp:Button ID="btnSave" runat="server" OnClick="btnSave_Click" 
                  CssClass="btn btn-success btn-lg btn-block" Text="SAVE" UseSubmitBehavior="false"
                  data-dismiss="modal" />
                </div>
            </div>
          </div>
    </div>
</div>
<!-- /.modal -->

</ContentTemplate>
</asp:UpdatePanel>
<!-- /.upModel -->
And GridView is:
<div class="col-lg-12 table-responsive">
    <asp:GridView ID="gvBanquet" CssClass="table table-striped table-bordered table-hover" runat="server" 
        AutoGenerateColumns="false" OnRowCommand="gvBanquet_RowCommand" AllowPaging="True" PageSize="5" 
        EmptyDataText="No record found!" OnPageIndexChanging="gvBanquet_PageIndexChanging" ShowHeaderWhenEmpty="true">
        <Columns>
            <asp:TemplateField HeaderText="Banquet Name">
                <ItemTemplate>
                    <asp:Label ID="lblID" runat="server" Visible="false" Text='<% #Eval("bqtID") %>'></asp:Label>
                    <asp:Label ID="lblName" runat="server" Text='<% #Eval("bqtName") %>' ></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>

            <asp:TemplateField>
                <HeaderTemplate>
                    <center>Events</center>
                </HeaderTemplate>
                <ItemTemplate>
                    <asp:Button ID="btnEdiit" runat="server" CssClass="btn btn-danger btn-sm" CommandName="EditRow" Text="Edit" />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
        <HeaderStyle BackColor="#5cb85c" BorderColor="#4CAE4C" ForeColor="White"></HeaderStyle>
        <PagerStyle Font-Size="Larger" ForeColor="Black" HorizontalAlign="Center" />
    </asp:GridView>
</div>
<!-- /.col-lg-12 -->
Here is RowCommand event:
protected void gvBanquet_RowCommand(object sender, GridViewCommandEventArgs e)
{
    GridViewRow row = (GridViewRow)(((Control)e.CommandSource).NamingContainer);
    int index = row.RowIndex;

    string id = GetTextFromGridViewLabel(gvBanquet,index,"lblID");
    string name = GetTextFromGridViewLabel(gvBanquet, index, "lblName");

    switch (e.CommandName)
    {
        case "EditRow":
            lblID.Text = id;
            txtName.Text = name;
            break;
        default:
            break;
    }
}
My problem is when I click on Edit button in GridView, the Bootstrap Model not popup with id and name from GridView row.
解决方案
Here can be a solution and follow bellow steps:


Add GridView also in another UpdatePanel.
Trigger GridView RowCommand event in first UpdatePanel upModel as like:
<ContentTemplate>
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="gvBanquet"  EventName="RowCommand" />  
</Triggers>

And finally run below StringBuilder code in RowCommand event:
case "EditRow":
    lblID.Text = id;
    txtName.Text = name;

    System.Text.StringBuilder sb = new System.Text.StringBuilder();
    sb.Append(@"<script type='text/javascript'>");
    sb.Append("$('#myModal').modal('show');");
    sb.Append(@"</script>");
    ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "MyModal", 
    sb.ToString(), false);

    break;



It will display popup on edit click as:



                        
这篇关于GridView上的Popup引导模型使用RowCommand事件编辑点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！