easyui 的行展开

注意还需要额外下载扩展的easyui的插件datagrid-detailview.js（ps：直接进easyui的中文官网就能够下载）

$(function () {
    $('#pl').datagrid({
        height: $("#body").height() + 500,
        width: $("#body").width(),
        idField: 'id',
        <span style="color:#FF0000;">view: detailview,</span>
        queryParams: '',
        url: 'risk/getsuitlist.htm',
        fit: true,
        fitColumns: true,
        striped: true,
        nowrap: true,
        rownumbers: true,
        showPageList: false,
        pagination: true,
        singleSelect: true,
        columns: [[
            // {field: 'id', checkbox: true, width: 70, halign: "center", align: "center"},
            {field: 'suitName', title: '题套名字', width: 70, halign: "center", align: "center"},
            {field: 'submitedTime',title: '提交时间',width: 50,halign: "center",align: "center",formatter: formatDatebox},
            {field: 'suitStatus', title: '当前状态', width: 50, halign: "center", align: "center",
                formatter: function (value, row, index) {
                    if (value == 10 || value == "") {return '待审核';} 
                    else if (value == -10) {return '审核拒绝';} 
                    else if (value == 20) {return '审核通过';} 
                    else if (value == 30) {return '发布成功';}
                }
            },
            {
                field: '操作', title: '操作', width: 100, halign: "center", align: "center",
                // 添加超级链，并将来文号作为参数传入
                formatter: function (value, row, index) {
                    if (row.ICONCLS && row.ICONCLS.length > 0) {
                    } else {
                        /* <a href="toeditManager.htm?id='+row.id+'">编辑</a>*/
                        //链接进行编辑，删除，设置权限等操作
                        var s = '<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="pl_tool.additem(' + index + ');" style="color:#75b7ff;">添加</a>'
                            + '| <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="pl_tool.dataremove(' + index + ');" style="color:#75b7ff;">编辑</a>'
                            + '| <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="pl_tool.setauthority(' + index + ');" style="color:#75b7ff;">删除</a>'
                            + '| <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="pl_tool.resetpassword(' + index + ');" style="color:#75b7ff;">提交</a>';
                        return s;
                    }
                }
            }
        ]],
        toolbar: '#pl_tool',

        <span style="color:#FF0000;">detailFormatter</span>:function(index,row){  
            return '<div style="padding:2px"><table id="ddv-' + index + '"></table></div>';
        },
        <span style="color:#FF0000;">onExpandRow</span>:function(index,row) {
            $('#ddv-' + index).datagrid({
                url: 'risk/getsuiteitem.htm?suiteId='+(row.id),
                fitColumns: true,
                // singleSelect: true,
                height: '100',  // <span style="color:#FF6666;">加个高度可以出现滚动条</span>
                rownumbers: true,
                columns: [[
                    {field: 'content', title: '题目', width: 100, halign: "center", align: "center"},
                    {field: 'itemContent', title: '选项', width: 70, halign: "center", align: "center"},
                    {field: 'itemScore', title: '分数', width: 70, halign: "center", align: "center"},
                ]],
                onResize:function(){
                    $('#pl').datagrid('fixDetailRowHeight',index);
                },
                onLoadSuccess:function(){
                    setTimeout(function(){
                        $('#pl').datagrid('fixDetailRowHeight',index);
                    },0);
                },
                onClickRow: function (rowIndex, rowData) {      // <span style="color:#FF6666;">点击表格中的行不选中</span>
                    $(this).datagrid('unselectRow', rowIndex);
                },
            });
        }

 BTW：其实easyui还挺简单的，看着api很容易进行快速开发