Datatables表格数据初始化时回调函数中修改要显示的值

冷不防 2023-10-18 16:08 42阅读 0赞

## 场景 ##

Datables初始化表数据后，返回的status状态值为1,2,3

现在要根据返回值的状态显示相应的中文。

![Image 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JBREFPX0xJVU1BTkdfUUlaSEk_size_16_color_FFFFFF_t_70][]

## 实现 ##

{ data: 'status',
                  render: function (data, type, full, meta ) {
                      if(data.trim()=="1"){
                          return '未提交'
                      }else if(data.trim()=="2"){
                          return '已提交'
                      }else if(data.trim()=="3"){
                          return '已打印'
                      }else{
                          return '未知状态'
                      }
                  }  },

### 举例： ###

function dataTableInit(){
        return $('#wmsReceiveOrder_table_id').DataTable({
          "language": {
            "processing": "处理中...",
            "lengthMenu": "显示 _MENU_ 项结果",
            "zeroRecords": "没有匹配结果",
            "info": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
            "infoEmpty": "显示第 0 至 0 项结果，共 0 项",
            "infoFiltered": "(由 _MAX_ 项结果过滤)",
            "infoPostFix": "",
            "search": "搜索:",
            "searchPlaceholder": "搜索...",
            "url": "",
            "emptyTable": "表中数据为空",
            "loadingRecords": "载入中...",
            "infoThousands": ",",
            "paginate": {
              "first": "首页",
              "previous": "上页",
              "next": "下页",
              "last": "末页"
            },
            "aria": {
              paginate: {
                first: '首页',
                previous: '上页',
                next: '下页',
                last: '末页'
              },
              "sortAscending": ": 以升序排列此列",
              "sortDescending": ": 以降序排列此列"
            },
            "decimal": "-",
            "thousands": "."
          },
          "processing": true,
          "searching" : false,
          "serverSide": true,
            "stateSave": true,
            "pageLength": 5,
            "lengthMenu": [ 5,10, 25, 50, 75, 100 ],
          "dom": '<"top">rt<"bottom"flpi><"clear">',
          "columnDefs": [ {
            "searchable": false,
            "orderable": false,
            "targets": 0
          }],
          columns: [
            { data: 'id' },
            { data: 'purchaseCode' },
              { data: 'deliveryTime',
                  render: function (data, type, full, meta ) {
                      return moment(data).format("YYYY-MM-DD HH:mm:ss");
                  } },
              { data: 'createrName' },
              { data: 'deliveryCode' },
              { data: 'gmtCreat',
                  render: function (data, type, full, meta ) {
                      return moment(data).format("YYYY-MM-DD HH:mm:ss");
                  } },
              { data: 'createrName' },
              { data: 'status',
                  render: function (data, type, full, meta ) {
                      if(data.trim()=="1"){
                          return '未提交'
                      }else if(data.trim()=="2"){
                          return '已提交'
                      }else if(data.trim()=="3"){
                          return '已打印'
                      }else{
                          return '未知状态'
                      }
                  }  },
          ],
          "ajax": function (data, callback, setting) {
              $.each(data.columns,function (index,value) {
                  //匹配所有input
                  $("#searchCondition").find('input[type="text"]').each(function () {
                      if(value.data === $(this).attr('id')){
                          value.search.value = $(this).val();
                      }
                  });
                  //匹配所有select
                  debugger
                  $("#searchCondition select").each(function () {
                      debugger
                      if(value.data === $(this).attr('id')){
                          value.search.value = $(this).val();
                      }
                  });
              })
            $.ajax({
              type: 'POST',
              url: "/wmsReceiveOrder/doPageForReceiveOrderTable",
              cache: false,  //禁用缓存
              data: JSON.stringify(data),  //传入组装的参数
              contentType: "application/json",
              dataType: "json",
              success: function (result) {
                debugger
                callback(result);
              }
            })
          }
        })
      }

[Image 1]: 
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JBREFPX0xJVU1BTkdfUUlaSEk_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/2019032610501973.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JBREFPX0xJVU1BTkdfUUlaSEk=,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，42人围观）

还没有评论，来说两句吧...

相关阅读

相关 Datatables表格数据初始化时回调函数中修改要显示的值

场景 Datables初始化表数据后，返回的status状态值为1,2,3 现在要根据返回值的状态显示相应的中文。 ![Image 1][]![watermark_t

冷不防/ 2023年10月18日 16:08/ 0 赞/ 43 阅读

相关为什么要用Promise：（牵扯到回调函数：回调地狱）

里面是伪代码：不能运行。 <!DOCTYPE html> <html lang="en"> <head> <meta ch

傷城~/ 2023年06月18日 13:56/ 0 赞/ 29 阅读

相关 js中的回调函数

一个函数被作为参数传递给另一个函数（在这里我们把另一个函数叫做otherFucntion），回调函数在otherFunction中被调用回调函数原理：

- 日理万妓/ 2023年02月23日 08:27/ 0 赞/ 148 阅读

相关函数的回调linux c,探讨C语言中的回调函数

\{ printf("The %d th charactor is: %c\\n", i, (char)('a' + i%26)); \} return 0; \}

超、凢脫俗/ 2023年01月21日 07:28/ 0 赞/ 87 阅读

相关 js中的回调函数

1：回调函数：定义了，但没有调，但最终执行了 2： dom事件回调函数定时器回调函数 ajax请求回调函数生命周期回调函数 documen

Bertha 。/ 2022年12月03日 15:49/ 0 赞/ 220 阅读

相关 java中的回调函数

CALLBACK，即回调函数，是一个通过函数指针调用的函数。如果你把函数的指针（地址）作为参数传递给另一个函数，当这个指针被用为调用它所指向的函数时，我们就说这是回调函数。回调

港控/mmm°/ 2022年11月01日 15:57/ 0 赞/ 212 阅读

相关回调函数

回调函数是一种函数指针的使用方式。 stdcall和cdecl的区别：这个问题涉及到函数调用的汇编知识，暂只需记住stdcall和cdecl的参数压栈顺序是相同的，参

傷城~/ 2022年06月12日 07:21/ 0 赞/ 345 阅读

相关 Datatables中文API——回调函数

fnCookieCallback：还没有使用过 $(document).ready(function () { $('example').d

比眉伴天荒/ 2022年04月13日 07:30/ 0 赞/ 391 阅读

相关 Javascript中的回调函数

参考文章：[https://www.zhihu.com/question/19801131/answer/91780287][https_www.zhihu.com_quest

港控/mmm°/ 2022年04月04日 12:30/ 0 赞/ 391 阅读

相关回调与回调函数

回调与回调函数回调回调函数回调回调指的是某函数在执行的时候，由于某些原因，该函数被迫中止执行，交出当前线程的使用权，当前线程转而执行其它函

悠悠/ 2021年09月25日 04:26/ 0 赞/ 616 阅读