zoukankan      html  css  js  c++  java
  • easyui-datagrid高度放大或缩小动态设置分页參数

    <div class="map_leftInfo" style="height: 745px;320px;border: 1px solid #dfdfdf;">
            <div style="margin:2px 5px auto 2px;height:100%;">
                <div id="queryCondition" style="border-bottom: 1px solid #D9E2E9;">
                    <dl style="100%;margin: 2px;">
                        <dd style="margin: 9px auto;">
                            <strong>类型:</strong>
                            <input type="radio" name="banPropertyType" value="" checked="checked"/>不限
                            <input type="radio" name="banPropertyType" value="1" style="margin-left: 10px;"/>楼盘
                            <input type="radio" name="banPropertyType" value="2" style="margin-left: 10px;"/>城中村
                            <input type="radio" name="banPropertyType" value="3" style="margin-left: 10px;"/>其它
                        </dd>
                        <dd style="margin: 9px auto;">
                            <strong>备注:</strong>
                            <input type="radio" name="banPropertyHasRemark" value="" checked="checked"/>不限
                            <input type="radio" name="banPropertyHasRemark" value="2" style="margin-left: 5px;"/>无备注
                            <input type="radio" name="banPropertyHasRemark" value="1" style="margin-left: 5px;"/>有备注
                        </dd>
                    </dl>
                </div>
                
                <div style="100%;">
                    <div style="100%;height:30px;border-bottom: 1px solid #dddddd;background: #F4F4F4;">
                        <div style="100%;height:100%;">
                            <input type="button" value="查询" onclick="queryBanTreeList();" style="float: right;margin: 4px 10px;padding: 1px 6px;height: 22px;"/>
                            <div class="pagination-btn-separator" style="float: right;"></div>
                            <img src="/oss-portlet/images/icons/arrow_up.png" class="showCondition" title="收缩查询条件" style="float: right;margin: 7px auto;cursor: pointer;">
                            <div class="pagination-btn-separator" style="float: right;"></div>
                            <img src="/oss-portlet/images/icons/arrow_in.png" title="所有收缩" onclick="javascript:$('#banTreeList').treegrid('collapseAll');" style="float: right;margin: 7px 10px 7px auto;cursor: pointer;">
                            <img src="/oss-portlet/images/icons/arrow_out.png" title="所有展开" onclick="javascript:$('#banTreeList').treegrid('expandAll');" style="float: right;margin: 7px 10px 7px auto;cursor: pointer;">
                            <img src="/oss-portlet/images/icons/batchMove_16.png" title="批量移动楼栋" onclick="openSelectPropertyWin();" class="operateImg">
                            <img src="/oss-portlet/images/icons/MergerBan_16.png" title="合并楼栋" onclick="openMergerBanWin();" class="operateImg">
                            <img src="/oss-portlet/images/icons/batchRemark_16.png" title="批量备注楼栋" onclick="openBatchRemarkBanWin();" class="operateImg">
                        </div>
                    </div>
                    <div style="100%;">
                        <table id="banTreeList"></table>
                    </div>
                </div>
                
            </div>

        </div>


    $(document).ready(function() {
        expandOrShrink();
    });



    /**
     * 展开和伸缩时resize列表
     */
    function expandOrShrink(){
        $(".showCondition").click(function (e) {
            if($("#queryCondition").is(":hidden")){
                $("#queryCondition").show("normal",function(){

                    // 设置grid大小
                    $("#banTreeList").treegrid('resize',{height:$(this).parents(".map_leftInfo").height() - $("#queryCondition").height() - 36});
                });
                e.target.src="/oss-portlet/images/icons/arrow_up.png";
                e.target.title = '收缩查询条件';

                   // 设置grid分页组件分页大小
                $("#banTreeList").treegrid("getPager").data("pagination").options.pageSize = 10;
                $("#banTreeList").treegrid("getPager").pagination('refresh');

                   // 设置grid分页大小
                banTreeList.data().treegrid.options.pageSize = 10;
                $("#banTreeList").treegrid("reload");
            }else{
                $("#queryCondition").hide("normal",function(){
                    $("#banTreeList").treegrid('resize',{height:$(this).parents(".map_leftInfo").height() - 54});
                });
                e.target.src="/oss-portlet/images/icons/arrow_down.png";
                e.target.title = '展开查询条件';
                $("#banTreeList").treegrid("getPager").data("pagination").options.pageSize = 24;
                $("#banTreeList").treegrid("getPager").pagination('refresh');
                banTreeList.data().treegrid.options.pageSize = 24;
                $("#banTreeList").treegrid("reload");
            }
        });
    }

  • 相关阅读:
    一个简单的反反爬~
    查缺补漏 -- python 之 and or的优先级
    从今天开始看《Redis深度历险》--HyperLogLog
    从今天开始看《Redis深度历险》--位图
    从今天开始看《Redis深度历险》--延时队列
    从今天开始看《Redis深度历险》--分布式锁
    redis之set【官方文档搬运+翻译】
    从今天开始看《Redis深度历险》--基础
    collections模块学习之namedtuple
    元组赋值谜题
  • 原文地址:https://www.cnblogs.com/wgwyanfs/p/6757610.html
Copyright © 2011-2022 走看看