【问题标题】:populate data on button click from the corresponding datatables row in a bootstrap modal在引导模式中从相应的数据表行中单击按钮时填充数据
【发布时间】:2016-04-19 00:16:22
【问题描述】:

Here 是一个类似的解决方案,唯一的区别是我想在单击按钮时在引导模式中填充行的数据。每行都有一个按钮。但是没有使用上面链接示例中使用的那些.responsive 脚本。

这是我的表的非常基本的示例。

 <table id="table1">
    <thead> <th>Table Data</th><th>Button</th>
    <td> $data </td> 
    <tr><td><button id=<?php echo $row['id'] ?> data-toggle="modal" class="pay" data-target="#myModal">Pay Fees</button></td></tr>
<div  class="modal fade" role="dialog" id="myModal">
<div class="modal-content">
 </div>
</div>

使用 Jquery 可以完成以下工作:

$(".pay").on( 'click', 'tr', function (){
    console.log( table.row( this ).data() );
      //pay_fees($id);
});

首选 Jquery 解决方案。

【问题讨论】:

  • 所以您希望能够单击加号按钮以在模式 (like in your link) 中查看行详细信息,但是这些字段应该是可编辑的?是否还有应该更新的后备数据库?
  • 不,我想在点击我自己的按钮时发生这种情况,就像在我的表格中一样。这个加号按钮要求我包含那些我不想包含的 .responsive 脚本
  • 你为什么不想使用它?我们不能只为您编写一个完整的定制插件。您需要将问题缩小到您不知道该怎么做的特定子任务。
  • 这不是写一个完整的插件。这只是如何将数据传输到特定行的引导模式,我提到了有效的 jquery 函数,因为......我想像 table.row( this ).data() 这样的东西可以做到这一点

标签: javascript php jquery twitter-bootstrap


【解决方案1】:

目前我使用以下代码来实现这一点:

$('#table1 tbody').on( 'click', 'tr button', function () {
    $('#myModal').modal('show');
    $(".modal-title").html(table.row($(this).parents(':eq(1)')).data()[0]);
} );

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-04-09
    • 2021-01-21
    • 2012-05-12
    • 2012-05-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多