Question

我用bootstrap制作一个网站。我有一个bootstrap表，最初它从包含PHP代码加载。这很好，没问题。

之后我点击了一个按钮，打开一个窗口模式，选择不同的参数来发送查询。我使用jquery和ajax将变量POST到另一个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的数据字段参数与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);

很高兴在您的示例中看到它，尝试一下并看到它有效。（谢谢！）

使用json对象在bootstrap-table中重新加载数据

1 个答案: