javascript - Asp.Net 在按钮单击时将值从 GridView 传递给模态文本框

Question

如上所述，我想知道如何将数据从 gridview 发送到模态 Asp:TextBox

网格视图按钮

<asp:TemplateField ShowHeader="False">
<ItemTemplate>
      <a data-id="<%#Eval("BookFile") %>"  title="Add this item" class="openDialog">Open Modal</a>
</center>
</ItemTemplate>
</asp:TemplateField>

脚本

<script type="text/javascript">
    $(function () {
        $(".openDialog").click(function () {
            $('#Id').val($(this).data('id'));
            $("#addDialog").modal("show");
        });
    });
</script>

模态

   <div class="modal fade" id="addDialog" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered" role="document">
   <div class="modal-content">

       <!-- Modal Head -->
      <div class="modal-header">
        <h5 class="modal-title" id="myModal1">Modal title</h5>
      </div>

      <!-- Modal Body -->
    <div class="modal-body">

            <div class="form-group">
            <asp:Label runat="server" AssociatedControlID="bookId1" CssClass="col-md-2 control-label">Username</asp:Label>
            <div class="col-md-10">
                <asp:TextBox runat="server" ID="Id" CssClass="form-control"/>
                <asp:RequiredFieldValidator runat="server" ControlToValidate="Id"
                    CssClass="text-danger" ErrorMessage="The field is required." />
            </div>
        </div>

    </div><!--End tag of Modal Body -->

      <!-- Modal Footer -->
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <asp:Button runat="server" OnClick="CreateUser_Click" Text="Add User" CssClass="btn btn-Success" />
      </div>


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

每当我使用它时，文本框都不会填充任何数据，但是每当我使用输入框时，代码都会起作用

<input type="text" name="Id" id="Id"> 

提前致谢！

标签： javascriptc#jqueryasp.netbootstrap-modal

Answer 1

好的。我可以通过简单地更改脚本来解决这个问题

<script type="text/javascript">
    $(function () {
        $(".openDialog").click(function () {
            $('#Id').val($(this).data('id'));
            $("#addDialog").modal("show");
        });
    });
</script>

至

<script type="text/javascript">
    $(function () {
        $(".openDialog").click(function () {
             document.getElementById("<%=Id.ClientID%>").value = $(this).data('id');
            $("#addDialog").modal("show");
        });
    });
</script>