来自应用程序状态的Jquery数据表源

Jquery Datatable source from Application state

本文关键字：Jquery 数据表 程序状态 应用      更新时间：2023-09-26

我有一个使用Reactjs-Redux构建的应用程序。现在，我正在尝试合并Jquery Datatable。因此，我想在数据表上的数据是通过在redux上调度操作来获取的。基本上，我已经有了关于我的应用程序状态的数据。我需要来自我的应用程序状态的这些数据在我的jquery数据表中。像这样：

    $('#example').DataTable( {
    "ajax": application_state.data,
    "columns": [
        { "data": "name[, ]" },
        { "data": "hr.0" },
        { "data": "office" },
        { "data": "extn" },
        { "data": "hr.2" },
        { "data": "hr.1" }
    ]
} );

显然，上面的代码不起作用，因为正如我所说，我的数据已经在我的应用程序状态中，我不必使用"ajax"。我也试过这样的东西：

    $('#example').DataTable( {
    "data": application_state.data,
    "columns": [
        { "data": "name[, ]" },
        { "data": "hr.0" },
        { "data": "office" },
        { "data": "extn" },
        { "data": "hr.2" },
        { "data": "hr.1" }
    ]
} );

但是，我仍然没有运气。

我所拥有的关于我的状态的JSON数据是完全有效的，它是一个对象数组。我只想把它加载到我的jquery数据表中。现在，有一种选择我知道会100%奏效，但它是肮脏的方式。这是通过在表上手动构建数据。我的意思是自己创建行（<tr><td>..）。我不喜欢那样。

非常感谢您的回复。最佳

我找到了一种使用aoColumns和fnAddData的方法。类似这样的东西：

// this is where field mapping happens
      const cols=[
         {'mDataProp':'<column/fieldname>'}
      ]
      const dataTableOptions = {
        responsive: true,
        bDestroy:true,
        pageLength: 25,
        deferRender:true,
        aoColumns:cols //The aoColumns
      }
      const _dt=$('#example')
              .dataTable(dataTableOptions);
    _dt.fnClearTable();
    _dt.fnAddData(<your state data here>)// Then Add your data using fnAddData

感谢收看。。。干杯我希望其他人也会觉得这很有帮助。

相关文章：