Question

我想更改寻呼机的布局，以便将VCR按钮全部组合在一起，然后是页码输入字段，然后是行数下拉列表。我该如何做到这一点？

这是我目前用于显示jqgrid的代码。它是标准的JavaScript代码：

$(function(){ 
  $("#" + listName).jqGrid({
    url: url,
    datatype: 'json',
    mtype: 'GET',
    colNames: columnNames,
    colModel: columnModel,
    pager: pagerName,
    rowNum: displayRows,
    rowList: rowList,
    sortname: initSortCol,
    sortorder: initSortOrder,
    viewrecords: true,
    multiselect: multiSelect,
    gridview: true,
    caption: caption,
    height: height,
    jsonReader: {
            root: 'data',
            page: 'currentPage',
            total: 'totalPages',
            records: 'totalRows',
            repeatitems: false,
            id: dataModelRowId
        }
  }); 
  jQuery("#" + listName).jqGrid('navGrid','#' + pagerName,{edit:false,add:false,del:false,search:false});

Answer 1

带有page number，number of records per page的jqgrid示例。

<强>代码：

$(document).ready(function(){
    //jqGrid
    $("#librariesList").jqGrid({
        url:'<%=request.getContextPath()%>/Admin/getAllLibraries',
        datatype: "json",               
        colNames:['Id','Edit','Type','Created Date', 'Modified Date', 'Url', 'Use Url'],
        colModel:[
            {name:'libraryId', index:'libraryId',search:false, width:30,sortable: false,hidden:true},
            {name:'libraryId', index:'libraryId',search:false, width:30,sortable: false, formatter: editLink},
            {name:'type',index:'type',width:80},
            {name:'createdDate',index:'createdDate',width:150},
            {name:'modifiedDate',index:'modifiedDate',width:150},
            {name:'url',index:'url',width:150},
            {name:'useUrl',index:'useUrl',width:50},
            ],
            rowNum:20,
            rowList:[10,20,30,40,50],
            rownumbers: true,  
            pager: '#pagerDiv',
            sortname: 'createdDate',  
            viewrecords: true,  
            sortorder: "asc",
            autowidth:'true',
    });

    $('#gridContainer div:not(.ui-jqgrid-titlebar)').width("100%");
    $('.ui-jqgrid-bdiv').css('height', window.innerHeight * .55);
    $('#load_librariesList').width("130");
    $("#librariesList").jqGrid('navGrid','#pagerDiv',{edit:false,add:false,del:false},{},{},{},{closeAfterSearch:true});
    $(".inline").colorbox({inline:true, width:"20%"});
});
function editLink(cellValue, options, rowdata, action)
   {
    return "<a href='<%=request.getContextPath()%>/Admin/editLibrary/"+ rowdata.libraryId + "' class='ui-icon ui-icon-pencil' ></a>";
}

jggrid显示如下：

jqgrid

jqgrid：如何更改寻呼机的布局？

1 个答案: