javascript - 为 Datatable 列定义多个 jQuery 变量

Question

背景：我有一个 53x 列的 jQuery 数据表。第一列是用户名，不可编辑。接下来的 52 列代表一年中的几个星期，每个星期都需要可编辑。它们都包含完全相同的选项。

问题：有没有更好的方法来定义所有 52 周，而不必“复制和粘贴”列数据 52 次？

我的代码：

$(document).ready( function () {
  $('#example').dataTable().makeEditable({
                    sUpdateURL: function(value, settings)
                            {
                                    return(value);
                            },
                    "aoColumns": [
                        null,
                        {
                        tooltip: 'Click to change leave',
                        loadtext: 'loading...',
                        type: 'select',
                        onblur: 'cancel',
                        submit: 'Ok',
                        data: "{'':'Please select...', 'A':'A','B':'B','C':'C'}",
                        loadtype: 'GET'
                        },
                        {
                        tooltip: 'Click to change leave',
                        loadtext: 'loading...',
                        type: 'select',
                        onblur: 'cancel',
                        submit: 'Ok',
                        data: "{'':'Please select...', 'A':'A','B':'B','C':'C'}",
                        loadtype: 'GET'
                        },

                 {REPEAT 49 more times}

                        {
                        tooltip: 'Click to change leave',
                        loadtext: 'loading...',
                        type: 'select',
                        onblur: 'cancel',
                        submit: 'Ok',
                        data: "{'':'Please select...', 'A':'A','B':'B','C':'C'}",
                        loadtype: 'GET'
                        } ]                 
    });

})

Answer 1

使用循环构建列数组，然后在传递给 dataTables 的配置对象的 aoColumns 属性中使用它。

$(document).ready( function () { 

         // columns array
         var aoColumns = [];
         aoColumns.push(null);

         for(var i=0;i<52; i++) {
         var column = { 
               tooltip: 'Click to change leave', 
               loadtext: 'loading...', 
               type: 'select', 
               onblur: 'cancel', 
               submit: 'Ok', 
               data: "{'':'Please select...', 'A':'A','B':'B','C':'C'}", 
               loadtype: 'GET' 
               };
               aoColumns.push(column);
         }

         $('#example').dataTable().makeEditable({ 
              sUpdateURL: function(value, settings) 
              { 
                   return(value); 
              }, 
              "aoColumns": aoColumns 
         });