根据JQgrid中的行数动态显示/隐藏寻呼机部分

Question

网格数据有时接收的行数较少，有时甚至多于来自flask框架的行数据。目前我在加载函数上动态处理表高度，如果行数大于10则指定一些固定高度，否则100％是桌子高度。

在loadcomplete函数中

setTableHeight(table);

功能

            function setTableHeight(table) {
            var length = $(grid_selector).getGridParam("reccount");
            alert(length);

            //setting height for grid to display 10 rows at a time
            if (length > 10) {
                 $(grid_selector).jqGrid('setGridHeight', 250 , true);
            } else {
            //if rows are less than 10 then setting height to 100%
                   $(grid_selector).jqGrid('setGridHeight', "100%", true);
            }

以类似的方式，如果行数大于10，我想显示寻呼机和页面选择选项，否则隐藏寻呼机，我在$("#pager").hide();内尝试了$("#pager").show();和setTableHeight(table)功能，但它不起作用

请分享一些想法

`的 __________________________________________________

从烧瓶中，我收到字典

[{'ChannelId': 1, 'Mapping': 'AMA111:AMA112,EM5'}, {'ChannelId': 2, 'Mapping': 'EM3,EM4'}, {'ChannelId': 3, 'Mapping': 'EM1,EM2'}, {'ChannelId': 4, 'Mapping': 'FPA1,FPA1'}, {'ChannelId': 5, 'Mapping': 'FPA3:FPA4,AMA113'}]

HTML Code-我在这里使用了jinja2模板

<table id="grid-table"></table>
<div id="grid-pager"></div>

<script type="text/javascript">
    var grid_data = [];
    {% for key in form.valid_map %}
        grid_data.push({'ChannelId':"{{ key['ChannelId']}}", 'Mapping':"{{ key['Mapping'] }}"});
    {% endfor %}

    jQuery(function($) {
        var grid_selector = "#grid-table";
        var pager_selector = "#grid-pager";

        jQuery(grid_selector).jqGrid({
            editurl: '/valid_mapping',
            data: grid_data,
            datatype: "local",
            width:600,

            colNames:['Channel Mapping Id', 'Channel Mapping'],
            colModel:[

            {name:'ChannelId',index:'ChannelId', width:50, sortable:true, editable: false},
            {name:'Mapping',index:'Mapping', width:55,editable:false},

            ],

            viewrecords : true,
            pager : pager_selector,
            altRows: true,
            multiselect: false,
            multiboxonly: true,
            rowNum:10,
                rowList:[10,20,50,100,160],

        loadComplete : function() {
                                                var table = this;
                                                setTimeout(function(){
                                                updatePagerIcons(table);
                                                enableTooltips(table);
                                                setTableHeight(table);
                                }, 0);
                },
            //caption: "Current Settings",
            autowidth: false,

        });


        //navButtons
        jQuery(grid_selector).jqGrid('navGrid',pager_selector,
            {



                                //navbar options
                                    edit: false,
                                    editicon : 'icon-pencil blue',
                                    add: false,
                                    addicon : 'icon-plus-sign purple',
                                    del: false,
                                    delicon : 'icon-trash red',
                                    search: true,
                                    searchicon : 'icon-search orange',
                                    refresh: true,
                                    refreshicon : 'icon-refresh green',
                                    view: false,
                viewicon : 'icon-zoom-in grey',
            },
            {
                //edit record form
                closeAfterEdit: true,
                recreateForm: true,
                beforeShowForm : function(e) {
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
                    style_edit_form(form);
                }
            },
            {
                //new record form
                closeAfterAdd: true,
                recreateForm: true,
                viewPagerButtons: false,
                beforeShowForm : function(e) {
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
                    style_edit_form(form);
                }
            },

            {
                //search form
                recreateForm: true,
                afterShowSearch: function(e){
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />')
                    style_search_form(form);
                },
                afterRedraw: function(){
                    style_search_filters($(this));
                },
                multipleSearch: true,
            },
            {
                //view record form
                recreateForm: true,
                beforeShowForm: function(e){
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />')
                }
            }
        );


        function setTableHeight(table) {
            var length = $(grid_selector).getGridParam("reccount");
            alert(length);

            //setting height for grid to display 10 rows at a time
            if (length > 10) {
                 $(grid_selector).jqGrid('setGridHeight', 250 , true);
            } else {
            //if rows are less than 10 then setting height to 100%
                   $(grid_selector).jqGrid('setGridHeight', "100%", true);
                   $(grid_selector).jqGrid({'pgbuttons':false, 'pginput':false})
            }
        }


    });
</script>
    {% endblock js %}