datagrid 的使用

//js基本使用结构:
$('#table').datagrid({
    url: "",
    queryParams: {
        name:name,
        id:id
    },
    fitColumns: fitColumns,//自适应宽度
    maxHeight: 700,
    resizeHandle: "right",
    pagination: false,
    singleSelect: false,
    checkOnSelect: false,
    remoteSort: true,
    showHeader: true,
    autoRowHeight: true,
    scrollbarSize:5,
    frozenColumns:[frozenColumns],
    columns: [dataGrid],
    onLoadSuccess: function (data) {}
});
//针对于frozenColumns,dataGrid可以动态生成,根据后台传过来的值拼接成字符串,如下:
for (var i = 0; i < data.length; i++) {
    var returnStr = "",sortable=true;
    if(dataFrozen[i].can_order==true){
        sortable=true;
    }else{
        sortable=false;
    }
    if (data[i].input_type == "label") {
        dataGrid += "{field: '" + data[i].produce_field + "', title: '" + data[i].field_ch + "',sortable: '"+sortable+"', align: 'center', width: 200";
    } else {
        dataGrid += "{field: '" + data[i].produce_field + "', title: '" + data[i].field_ch + "',sortable: '"+sortable+"', align: 'center', width: 200,formatter: function (value, row) {";
        if (data[i].input_type == "text" && data[i].data_type == "none") {
            returnStr = '<input type="text" name="' + data[i].produce_field + '" stepName="'+data[i].stepName+'" title="'+data[i].field_ch+'" class="form-control" value="">';
        } else if (data[i].input_type == "text" && data[i].data_type == "number") {
            returnStr = '<input type="number" name="' + data[i].produce_field + '" stepName="'+data[i].stepName+'" title="'+data[i].field_ch+'" class="form-control" value="">';
        } else if (data[i].input_type == "image") {
            returnStr = '<img data-original="" class="lazy" data-toggle="modal" data-target="#Viwepager"  name="' + data[i].produce_field + '" style="width:100px;height:100px;">';
        } else if (data[i].input_type == "select") {
            returnStr = '<select class="form-control" field="'+data[i].produce_field+'" stepName="'+data[i].stepName+'" title="'+data[i].field_ch+'">';
            var dataText = data[i].text;
            returnStr += '<option value="">请选择</option>';
            for (var j = 0; j < dataText.length; j++) {
                returnStr += '<option value="' + dataText[j].id + '" key="'+dataText[j].name+'">' + dataText[j].name + '</option>';
            }
            returnStr += '</select>';
        }
        dataGrid += "return '" + returnStr + "'}";
    }
    dataGrid += "},"
}
//在表格中插入一行
for (var i = 0; i < data.length; i++) {
    var inputstr="<input type='text' class='datasearch' onchange='javascript:searchData()' style='width: 100%;' value=''/>";
    insertRow+='"'+data[i].produce_field+'":\"'+inputstr+'\",';
}
insertRow=insertRow.substring(0,insertRow.length-1)+"}";
insertRow=eval("("+insertRow+")");
$('#table').datagrid('insertRow',{
    index: 0,
    row:insertRow
});
注:在表格中插入一行时,datagrid会自动给它总数量+1,需要修改源码easyUI.js中insertRow部分源码,把页码加1去掉就OK
--------------------- 
作者:南宫凌萱 
来源:CSDN 
原文:https://blog.csdn.net/qq_34223398/article/details/70792256 
版权声明:本文为博主原创文章,转载请附上博文链接!

猜你喜欢

转载自blog.csdn.net/qq_33238935/article/details/85163437