easyui表格，单元格合并

easyui的合并单元格比较麻烦，官网提供一下方法

 $('#tt').datagrid({

         onLoadSuccess:function(){

             var merges = [{

                 index:2,

                 rowspan:2

             },{

                 index:5,

                 rowspan:2

             },{

                 index:7,

                 rowspan:2

             }];

             for(var i=0; i<merges.length; i++)

                 $('#tt').datagrid('mergeCells',{

                     index:merges[i].index,

                     field:'productid',

                     rowspan:merges[i].rowspan

                 });

         }

     });

此方法判断太麻烦了，其实easyui可以自定义单元格格式，我们可以利用此特性，在单元格内内嵌一个两行一列的表格

  {

     title: '本周实际', field: 'weekActual',

     formatter: function (value, row) {

     　　var table = fine.workplan.celltable({data:{except:row.weekHourExcept, acutal:value}});

        return table;

     }

  }

上列代码中 fine.workplan.celltable 为soy模板文件（根据模板和参数生成js），具体代码为

 {namespace fine.workplan}

 /**

 @param data

 */

 {template .celltable}

 <table class="cell-table">

     <tr><td class="first-row-cell">{$data.except}</td></tr>

     <tr>

         <td class="second-row-cell"

             {if $data.except > $data.acutal}style="background-color:#ada;"{/if}

         >

             {$data.acutal}

         </td>

     </tr>

 </table>

 {/template}

巴特西

easyui表格，单元格合并

最新文章

热门文章