如何使用 url: 而不是 data: 用于 onExpandRow 函数？

Question

我遵循了 onExpandRow 的示例，但是我无法弄清楚如何使用通过 url 传递的行信息而不是数据标记用于我的 table。目前它只是在扩展函数中复制我的整个 table，而不仅仅是行数据。可能是一个简单的修复，但我错过了它。

onExpandRow: function (index, row, $detail) {
console.log(row)
  $detail.html('<table></table>').find('table').bootstrapTable({
            url: 'table.php',
            columns:[{
                field: 'mfr_name',
                title: 'manufacturer'},
                {field: 'phone_number',
                title: 'phone'},
            ],

        })

该示例将数据保存在变量中并使用数据：调用而不是 url：一个。

var data = [{
'col1': '1.1',
'col2': '1.2',
'nested': [{
'col3': '1.3',
'col4': '1.4',
'col5': '1.5'
}]
 onExpandRow: function(index, row, $detail) {
  console.log(row)
  $detail.html('<table></table>').find('table').bootstrapTable({
    clickToSelect: true,
    columns: [{
      field: 'select',
      checkbox: true
    }, {
      field: 'col3',
      title: 'Col3'
    }, {
      field: 'col4',
      title: 'Col4'
    }, {
      field: 'col5',
      title: 'Col5'
    }],
    data: row.nested,

Answer 1

你的意思是这样的吗:

http://jsfiddle.net/eitanmg/m41ok0ue/12/

主要的变化是当扩展行时，它会AJAX调用从远程资源而不是本地变量中获取你想要的数据。

 $(function () {
  $('#table').bootstrapTable({
    data: data,
    detailView:true,
    onExpandRow: function (index, row, $detail) {
    $detail.html('Loading request...');
    $.ajax({
        type: "GET",
        url: "/your_custom_url_that_contains_the_data",
        success: function (result) {
          $detail.html('<table></table>').find('table').bootstrapTable({
          columns: [{
              field: 'select',
              checkbox: true
              }, {
              field: 'col1',
              title: 'Col1'
              }, {
              field: 'col2',
              title: 'Col2'
              }, {
              field: 'col3',
              title: 'Col3'
          }],
          data: JSON.parse(result),
          });
        }
      });
    }
  });
});

如何使用 url: 而不是 data: 用于 onExpandRow 函数？

How to use url: instead of data: for onExpandRow function?

bootstrap-table