繁体   English   中英

如何显示模态体内的输入数据?

[英]How to show input data inside modal body?

单击某些按钮后,我的表中有几个元素和模态,我想调用模态(带有表元素数据),这是我的代码:

<div class="container" >
      <h1>Bootstrap modal dialogs with angular</h1>
      <p>Click the edit button to edit the person's name in a modal dialog.</p>

      <table class="table table-hover"" ng-repeat="person in persons" >
        <tr>
          <th>Name</th>
          <th>Actions</th>
        </tr>
        <tr><td><input style="width:100px;" type="text" id="id"  ng-model="person.id" /></td>
     <td><button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#exampleModal" id="but">Details</button></td></tr>
      </table>

    </div>

    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

而且我想接受这样的响应,而没有DaTatables: https ://datatables.net/extensions/sensitive/examples/display-types/modal.html

我在脚本中添加了类似的逻辑,但对我不起作用:

$(".btn[data-target='#myModal']").click(function() {
 $("#exampleModal").html('Edit auction with id '+ $(e.relatedTarget).data('id'));
     $("#exampleModal").html($(e.relatedTarget).data('title'));
    $('#exampleModal ').find('input#input-id').val($(e.relatedTarget).data('title'))
});

我应该改变以获得适当的结果?

$(".btn[data-target='#exampleModal']").click(function() {
     $("#exampleModal").html($(e.currentTarget).data('title'));
    $('#exampleModal ').find('input#input-id').val($(e.currentTarget).data('title'))
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM