BOOTSTRAP MODALPOPUP（当我在bootstrao模式弹出窗口中将值传递给文本框时，弹出窗口显示但文本框未填充） [英] BOOTSTRAP MODALPOPUP(when I pass a value to a textbox in bootstrao modal popup , popup is shoing but text box is not filling)

查看：102
本文介绍了BOOTSTRAP MODALPOPUP（当我在bootstrao模式弹出窗口中将值传递给文本框时，弹出窗口显示但文本框未填充）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

这是我的前端



THIS IS MY FRONT END

<%@ Page Title="" Language="C#" MasterPageFile="~/Main.master" AutoEventWireup="true" CodeFile="Category.aspx.cs" Inherits="Category" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
     <asp:Label ID="lblCID" runat="server" Text="" Visible="false">
   
    
       Add New Category
    
        function openModal()
        {
            $('#modal-header-primary').modal('show');
            
        }
    

    <%--Modal popup start--%>
     <div id="modal-header-primary" class="modal fade">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header modal-header-primary">
                                ×
                                <h4 id="modal-header-primary-label" class="modal-title">Add New Category</h4>

                            </div>
                            <div class="modal-body">
                                  <div class="col-md-6">
                                                <div class="form-group">
                                                    <div class="input-icon">
                                                        
                                                        <asp:TextBox ID="txtCategoryName"  runat="server" class="form-control" data-toggle="tooltip">
                                                    </div>
                                                </div>
                                            </div>

                            </div>
                            <br>
                            <div class="modal-footer">
                                 
                                Close
                                <asp:Button ID="btnCategory" runat="server" Text="Submit" OnClick="btnCategory_Click" class="btn btn-primary"/>
                                
                            </div>
                        </div>
                    </div>
                </div>
    <%--Modal popup end--%>

    <%--Grid View start--%>
    <asp:ScriptManager ID="ScriptManager1" runat="server"

        EnablePageMethods="true">
    
          
      <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                  <triggers>

<asp:AsyncPostBackTrigger ControlID="GVCategoryDetails" EventName="RowCommand" />


        <contenttemplate>
    
     <div class="row">
   
          
         </div>
    <div class="col-lg-12">

        <div class="row">
            <asp:Label ID="lblID" runat="server" Text="lblID" Visible="false">
            <asp:Label ID="lblMsg" runat="server" Text="" ForeColor="Red" Visible="false">

            <div class="panel panel-red">
                            <div class="panel-heading">Category Details</div>
                            <div class="panel-body">
            <asp:GridView ID="GVCategoryDetails" runat="server" CssClass="table table-hover table-bordered" PagerStyle-CssClass="pager"

                HeaderStyle-CssClass="header" RowStyle-CssClass="rows" AllowPaging="True" OnPageIndexChanging="GVCategoryDetails_PageIndexChanging"

                AutoGenerateColumns="false" OnRowDeleting="GVCategoryDetails_RowDeleting" 

                OnRowCommand="GVCategoryDetails_RowCommand" DataKeyNames="CategoryId"  PageSize="25">

                <columns>
                    <asp:TemplateField HeaderText="Sl.No.">
                        <itemtemplate>
                            <%#Container.DataItemIndex+1 %>
                        
                    
                  

                    <asp:BoundField HeaderText="CategoryId" DataField="CategoryId" Visible="false"

                        ItemStyle-HorizontalAlign="Justify">

                        <ItemStyle HorizontalAlign="Justify">
                    

                    <asp:BoundField HeaderText="Category Name" DataField="CategoryName"

                        ItemStyle-HorizontalAlign="Justify">

                        <ItemStyle HorizontalAlign="Justify">
                    

              
                    <asp:TemplateField HeaderText="Manage">

                        <itemtemplate>



                            <asp:ImageButton ID="ImgView" runat="server" CausesValidation="False" CommandName="ViewPopup" ToolTip="Click here to view " ImageAlign="Middle" ImageUrl="~//images/view.png" />    
                            <asp:ImageButton ID="ImgEdit" runat="server" CausesValidation="False" CommandName="Edit" ToolTip="Click here to edit " ImageAlign="Middle" ImageUrl="~/images/edit.png" />    
                            <asp:ImageButton ID="ImgDelete" runat="server" CausesValidation="False" CommandName="Delete" ToolTip="Click here to delete" ImageAlign="Middle" ImageUrl="~/images/delet.png" />



                        
                    


                
            
                                </div>

        </div>
    </div>
        </div>
            
          
    <%--GridView end--%>









C# CODE





C# CODE

protected void GVCategoryDetails_RowCommand(object sender, GridViewCommandEventArgs e)
   {
       if (e.CommandName == "ViewPopup")
       {
           ImageButton ImgView = (ImageButton)e.CommandSource;
           GridViewRow row = (GridViewRow)ImgView.Parent.Parent;
           int CategoryId = Convert.ToInt32(GVCategoryDetails.DataKeys[row.RowIndex].Value);
           DataTable dtCategory= _objMainBL.GetCategoryDetailsbyId(CategoryId);

           if (dtCategory!= null && dtCategory.Rows.Count > 0)
           {
             txtCategoryName.Text = dtCategory.Rows[0]["CategoryName"].ToString();
           lblCID.Text = dtCategory.Rows[0]["CategoryId"].ToString();
           ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "openModal();", true);

           }


       }
   }





What I have tried:



I need to display value in textbox



What I have tried:

I need to display value in textbox

推荐答案

('#modal-header-primary').modal('show');

}


<%--Modal popup start--%>
<div id=\"modal-header-primary\" class=\"modal fade\">
<div class=\"modal-dialog\">
<div class=\"modal-content\">
<div class=\"modal-header modal-header-primary\">
×
<h4 id=\"modal-header-primary-label\" class=\"modal-title\">Add New Category</h4>

</div>
<div class=\"modal-body\">
<div class=\"col-md-6\">
<div class=\"form-group\">
<div class=\"input-icon\">

<asp:TextBox ID=\"txtCategoryName\" runat=\"server\" class=\"form-control\" data-toggle=\"tooltip\">
</div>
< /div>
</div>

</div>
<br>
<div class=\"modal-footer\">

Close
<asp:Button ID=\"btnCategory\" runat=\"server\" Text=\"Submit\" OnClick=\"btnCategory_Click\" class=\"btn btn-primary\"/>

</div>
</div>
</div>
</div>
<%--Modal popup end--%>

<%--Grid View start--%>
<asp:ScriptManager< span class=\"code-attribute\"> ID=\"ScriptManager1\" runat=\"server\"

EnablePageMethods=\"true\">


<asp:UpdatePanel ID=\"UpdatePanel1\" runat=\"server\">
<triggers>

<asp:AsyncPostBackTrigger ControlID=\"GVCategoryDetails\" EventName=\"RowCommand\" />


<contenttemplate>

<div class=\"row\">


</div>
<div class=\"col-lg-12\">

<div class=\"row\">
<asp:Label ID=\"lblID\" runat=\"server\" Text=\"lblID\" Visible=\"false\">
<asp:Label ID=\"lblMsg\" runat=\"server\" Text=\"\" ForeColor=\"Red\" Visible=\"false\">

<div class=\"panel panel-red\">
<div class=\"panel-heading\">Category Details</div>
<div class=\"panel-body\">
<asp:GridView ID=\"GVCategoryDetails\" runat=\"server\" CssClass=\"table table-hover table-bordered\" PagerStyle-CssClass=\"pager\"

HeaderStyle-CssClass=\"header\" RowStyle-CssClass=\"rows\" AllowPaging=\"True\" OnPageIndexChanging=\"GVCategoryDetails_PageIndexChanging\"

AutoGenerateColumns=\"false\" OnRowDeleting=\"GVCategoryDetails_RowDeleting\"

OnRowCommand=\"GVCategoryDetails_RowCommand\" DataKeyNames=\"CategoryId\" PageSize=\"25\">

<columns>
<asp:TemplateField HeaderText=\"Sl.No.\">
<itemtemplate>
<%#Container.DataItemIndex+1 %>




<asp:BoundField HeaderText=\"CategoryId\" DataField=\"CategoryId\" Visible=\"false\"

ItemStyle-HorizontalAlign=\"Justify\">

<ItemStyle HorizontalAlign=\"Justify\">


<asp:BoundField HeaderText=\"Category Name\" DataField=\"CategoryName\"

ItemStyle-HorizontalAlign=\"Justify\">

<ItemStyle HorizontalAlign=\"Justify\">



<asp:TemplateField HeaderText=\"Manage\">

<itemtemplate>



<asp:ImageButton ID=\"ImgView\" runat=\"server\" CausesValidation=\"False\" CommandName=\"ViewPopup\" ToolTip=\"Click here to view \" ImageAlign=\"Middle\" ImageUrl=\"~//images/view.png\" />    
<asp:ImageButton ID=\"ImgEdit\" runat=\"server\" CausesValidation=\"False\" CommandName=\"Edit\" ToolTip=\"Click here to edit \" ImageAlign=\"Middle\" ImageUrl=\"~/images/edit.png\" />    
<asp:ImageButton ID=\"ImgDelete\" runat=\"server\" CausesValidation=\"False\" CommandName=\"Delete\" ToolTip=\"Click here to delete\" ImageAlign=\"Middle\" ImageUrl=\"~/images/delet.png\" />






$ b$b

</div>

</div>
</div>
</div>


<%--GridView end--%>
('#modal-header-primary').modal('show'); } <%--Modal popup start--%> <div id="modal-header-primary" class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header modal-header-primary"> × <h4 id="modal-header-primary-label" class="modal-title">Add New Category</h4> </div> <div class="modal-body"> <div class="col-md-6"> <div class="form-group"> <div class="input-icon"> <asp:TextBox ID="txtCategoryName" runat="server" class="form-control" data-toggle="tooltip"> </div> </div> </div> </div> <br> <div class="modal-footer"> Close <asp:Button ID="btnCategory" runat="server" Text="Submit" OnClick="btnCategory_Click" class="btn btn-primary"/> </div> </div> </div> </div> <%--Modal popup end--%> <%--Grid View start--%> <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <triggers> <asp:AsyncPostBackTrigger ControlID="GVCategoryDetails" EventName="RowCommand" /> <contenttemplate> <div class="row"> </div> <div class="col-lg-12"> <div class="row"> <asp:Label ID="lblID" runat="server" Text="lblID" Visible="false"> <asp:Label ID="lblMsg" runat="server" Text="" ForeColor="Red" Visible="false"> <div class="panel panel-red"> <div class="panel-heading">Category Details</div> <div class="panel-body"> <asp:GridView ID="GVCategoryDetails" runat="server" CssClass="table table-hover table-bordered" PagerStyle-CssClass="pager" HeaderStyle-CssClass="header" RowStyle-CssClass="rows" AllowPaging="True" OnPageIndexChanging="GVCategoryDetails_PageIndexChanging" AutoGenerateColumns="false" OnRowDeleting="GVCategoryDetails_RowDeleting" OnRowCommand="GVCategoryDetails_RowCommand" DataKeyNames="CategoryId" PageSize="25"> <columns> <asp:TemplateField HeaderText="Sl.No."> <itemtemplate> <%#Container.DataItemIndex+1 %> <asp:BoundField HeaderText="CategoryId" DataField="CategoryId" Visible="false" ItemStyle-HorizontalAlign="Justify"> <ItemStyle HorizontalAlign="Justify"> <asp:BoundField HeaderText="Category Name" DataField="CategoryName" ItemStyle-HorizontalAlign="Justify"> <ItemStyle HorizontalAlign="Justify"> <asp:TemplateField HeaderText="Manage"> <itemtemplate> <asp:ImageButton ID="ImgView" runat="server" CausesValidation="False" CommandName="ViewPopup" ToolTip="Click here to view " ImageAlign="Middle" ImageUrl="~//images/view.png" />     <asp:ImageButton ID="ImgEdit" runat="server" CausesValidation="False" CommandName="Edit" ToolTip="Click here to edit " ImageAlign="Middle" ImageUrl="~/images/edit.png" />     <asp:ImageButton ID="ImgDelete" runat="server" CausesValidation="False" CommandName="Delete" ToolTip="Click here to delete" ImageAlign="Middle" ImageUrl="~/images/delet.png" /> </div> </div> </div> </div> <%--GridView end--%>









C# CODE





C# CODE

protected void GVCategoryDetails_RowCommand(object sender, GridViewCommandEventArgs e)
   {
       if (e.CommandName == "ViewPopup")
       {
           ImageButton ImgView = (ImageButton)e.CommandSource;
           GridViewRow row = (GridViewRow)ImgView.Parent.Parent;
           int CategoryId = Convert.ToInt32(GVCategoryDetails.DataKeys[row.RowIndex].Value);
           DataTable dtCategory= _objMainBL.GetCategoryDetailsbyId(CategoryId);

           if (dtCategory!= null && dtCategory.Rows.Count > 0)
           {
             txtCategoryName.Text = dtCategory.Rows[0]["CategoryName"].ToString();
           lblCID.Text = dtCategory.Rows[0]["CategoryId"].ToString();
           ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "openModal();", true);

           }


       }
   }





What I have tried:



I need to display value in textbox



What I have tried:

I need to display value in textbox


Hi there,



Place your boostrap popup structure (or just your txtCategoryName control) inside an updatepanel with UpdateMode set to Conditional. Either set a trigger for the appropriate gridview event (GVCategoryDetails_RowCommand) or update it from code behind:

Hi there,

Place your boostrap popup structure (or just your txtCategoryName control) inside an updatepanel with UpdateMode set to Conditional. Either set a trigger for the appropriate gridview event (GVCategoryDetails_RowCommand) or update it from code behind:
YourUpdatePanel.Update();

That should do it.



2019/02/12: Update.



Given your comment \"When I use modal inside update panel I can’t access txtCategoryName from Code behind\", I can only assume you are interacting with your model purely from client-side js.



Please, take a look at this example (bootstrap 4.1.1):

That should do it.

2019/02/12: Update.

Given your comment "When I use modal inside update panel I can't access txtCategoryName from Code behind", I can only assume you are interacting with your model purely from client-side js.

Please, take a look at this example (bootstrap 4.1.1):

<asp:UpdatePanel ID="UpdPnlModalTest" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
    <Triggers> <asp:AsyncPostBackTrigger ControlID="btnTest" EventName="Click" /> </Triggers>
    <ContentTemplate>

        <div class="modal fade" id="modal_Test" role="dialog" tabindex="-1">
            <div class="modal-dialog modal-dialog-centered">
                <div class=" modal-content">
                    <div class="modal-header">
                        <h2 class="modal-title col-10">Modal Test</h2>
                        <button type="button" class="close" data-dismiss="modal">×</button>
                    </div>
                    <div class="modal-body">
                        <asp:Label ID="lbTestData" runat="server"></asp:Label>
                    </div>
                    <div class="modal-footer"></div>
                </div>
            </div>
        </div>

    </ContentTemplate>
</asp:UpdatePanel>

I make this modal visible from code behind:

I make this modal visible from code behind:

 ... void btnTest_Click(object sender, EventArgs e)
{
  //...
  lbTestData.Text = "Some string value for testing purposes!";
  //...
  ScriptManager.RegisterStartupScript(objPage, objType, "ShowIt",
  "


(document).ready(function() {
(document).ready(function() {


这篇关于BOOTSTRAP MODALPOPUP（当我在bootstrao模式弹出窗口中将值传递给文本框时，弹出窗口显示但文本框未填充）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发语言最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆