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" οnclick="pl_tool.additem(' + index + ');" style="color:#75b7ff;">添加</a>'
                            + '| <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" οnclick="pl_tool.dataremove(' + index + ');" style="color:#75b7ff;">编辑</a>'
                            + '| <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" οnclick="pl_tool.setauthority(' + index + ');" style="color:#75b7ff;">删除</a>'
                            + '| <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" οnclick="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很容易进行快速开发

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值