使用 json 对象重新加载引导表中的数据

Question

我用引导程序制作了一个网站。我有一个引导表，最初它是从包含 php 代码加载的。这工作正常，没有问题。

之后我有一个按钮，当它被点击时，它会打开一个窗口模式来选择不同的参数来发送查询。我使用 jquery 和 ajax 将变量发布到另一个 php，我得到一个 json 对象：

{
  "estado":"PE",
  "id_usuario":"20",
  "nombre":"Irene",
  "apellido1":"Munn\u00e9",
  "id_addtime_horario":"7",
  "fecha":"2016-12-30",
  "dia_semana":"friday   ",
  "hora_ini":"10:00:00",
  "hora_fin":"15:09:26",
  "jornada":"05:42:12",
  "jornada_flexibilidad":"00:02:46",
  "jornada_deficit":"00:00:00",
  "extra_jornada":"00:00:00",
  "extra_autorizado":null,
  "id_fichaje":"1766",
  "id_fichaje_detalle":"44071"
}

问题是我无法用这个数组加载引导表。

我在互联网和这里读了很多。我试图制作一个小的引导表和小查询来丢弃代码减法中的错误，但它不能正常工作。它总是得到 json 对象，但它没有加载到引导表中。

我使用这个 jquery 代码通过 post 将参数发送到 php 代码并使用这个参数获取 json 对象：

  /*  QUERY   */

      $('#executaquery').on('click', function(){

          //  Recupero valors per POST to php

          var usuari = document.getElementById('usuari').value;
          var estat = document.getElementById('estat').value;
          var data_in = document.getElementById('data_in').value;
          var data_fi = document.getElementById('data_fi').value;

      $.ajax({                                                              // Llamada a queryProduct.php devuelve objeto array JSON asigno a
         method: 'POST',                                                      // los campos de modal window
         dataType: 'json',
         url: 'queryFitxatges.php',
         data: { usuaris: usuari, estats: estat, datain: data_in, datafi: data_fi},

         success: function(response) {

            $('#consulta').modal('hide');

            var myData = [];
            myData.push(response);

            $('#tableprod').bootstrapTable('load', myData);
         }
      });
  });

我已经阅读了将 json 对象与 bootstrap-table 的字段链接起来，只有 bootstrap-table 的 data-field 参数必须与 json 对象相同：

  <thead class='thead-inverse'>
                  <tr>
                      <th data-switchable='false' data-checkbox='true'></th>
                      <th data-field='estado' data-sortable='true'><?php echo $cols[0]; ?></th>
                      <th data-field='id_usuario' data-sortable='true'><?php echo $cols[1]; ?></th>
                      <th data-field='nombre' data-sortable='true'><?php echo $cols[2]; ?></th>
                      <th data-field='apellido1' data-sortable='true'><?php echo $cols[3]; ?></th>
                      <th data-field='id_addtime_horario' data-sortable='true'><?php echo $cols[4]; ?></th>
                      <th data-field='fecha' data-sortable='true'><?php echo $cols[5]; ?></th>
                      <th data-field='dia_semana' data-sortable='true'><?php echo $cols[6]; ?></th>
                      <th data-field='hora_ini' data-sortable='true'><?php echo $cols[7]; ?></th>
                      <th data-field='hora_fin' data-sortable='true'><?php echo $cols[8]; ?></th>
                      <th data-field='jornada' data-sortable='true'><?php echo $cols[9]; ?></th>
                      <th data-field='jornada_flexibilidad' data-sortable='true'><?php echo $cols[10]; ?></th>
                      <th data-field='jornada_deficit' data-sortable='true'><?php echo $cols[11]; ?></th>
                      <th data-field='extra_jornada' data-sortable='true'><?php echo $cols[12]; ?></th>
                      <th data-field='extra_autoritzado' data-sortable='true'><?php echo $cols[13]; ?></th>
                      <th data-field='edit' data-sortable='false' data-switchable='false'>EDIT</th>
                    </tr>
              </thead>
              <tbody>
            <?php while ($row = pg_fetch_row($result)){ ?>
                  <tr id='<?php echo $row[14]; ?>' data-idfixatgedetall='<?php echo $row[15]; ?>' data-estado='<?php echo $row[0] ?>' data-autoritzat='<?php echo $autoritzat = $row[12]; ?>'>
                      <td></td>
                      <td data-field='estado'><?php echo $estado = EstadoIcon($row[0]); ?></td>
                      <td data-field='id_usuario'><?php echo $row[1]; ?></td>
                      <td data-field='nombre'><?php echo $row[2]; ?></td>
                      <td data-field='apellido1'><?php echo $row[3]; ?></td>
                      <td data-field='id_addtime_horario'><?php echo $row[4]; ?></td>
                      <td data-field='fecha'><?php echo $date = FormatDate($row[5]); ?></td>
                      <td data-field='dia_semana'><?php echo $dia = Dia($row[6]); ?></td>
                      <td data-field='hora_ini'><?php echo $time = FormatTime24($row[7]); ?></td>
                      <td data-field='hora_fin'><?php echo $time = FormatTime24($row[8]); ?></td>
                      <td data-field='jornada'><?php echo $time = FormatTime($row[9]); ?></td>
                      <td data-field='jornada_flexibilidad'><?php echo $time = FormatTime($row[10]); ?></td>
                      <td data-field='jornada_deficit'><?php echo $time = FormatTime($row[11]); ?></td>
                      <td data-field='extra_jornada'><?php echo $time = FormatTime($row[12]); ?></td>
                      <td data-field='extra_autoritzat'><?php echo $autoritzat = Autoritzat($row[13]); ?></td>
                      <td><button class='btn btn-xs edit btn-addcom' data-toggle='modal' data-target='#edit'><i class="material-icons" style="font-size: 20px">edit</i> </button></td>
                  </tr>
            <?php }  ?>
              </tbody>
            </table>

我尝试使用参数 'load' 和 'append' 加载数据，但结果相同。

任何人都可以帮助我了解如何将 json 对象与 bootstrap-table 的字段链接起来？会不会是第一个数据加载是使用php的错误？

Answer 1

谢谢！我一直在努力用 ajax 刷新引导表（在 Ruby on Rails 应用程序中）。不知道：

$('#tableprod').bootstrapTable('load', myData);

在我的 ajax 函数中使用这个：

$('#tableprod').bootstrapTable({ data: data });

它第一次填充了表格，但是当我从下拉选择中再次调用该 ajax 函数时，它不会刷新。

刚刚发现：如果我的 ajax 函数中有这个，它会刷新表格：

$('#taggedStudyTable').bootstrapTable({ data: data });
$('#taggedStudyTable').bootstrapTable('load', data);

在您的示例中看到这一点感到很欣慰，尝试一下，看看它是否有效。 （谢谢！）