zoukankan      html  css  js  c++  java
  • Dialog 窗口 滚动条

    本人用Dialog做了一个弹出框,又在弹出框内展示的是树形结构treegrid。

    但是在树形结构数据很多的时候,窗口并不会显示右边的滚动条,导致下面的都看不到。

    经过研究发现dialog是在数据足够多的时候自动显示滚动条,但是我内置的treegrid height开始设置的小于了dialog 设置的 height,足够多数据不能触发dialog窗口;

    结论是:把内置的树形结构不设置height就好了。

    有个缺点是,数据不多的时候也显示滚动条,有路过的指点下吧。

    代码如下

    HTML:

        <div id="belongOrg_div">

            <table id="belongOrgTreeGrid"></table>

        </div>

    JS:

    function belongOrgTree(){//事件触发这个函数。

        $("#belongOrg_div").dialog({

            title: '放大镜',

             620,

            height: 505,

            cache: false,

            modal: true,

            onClose: function(){

                p.onClose.call();

                $(this).remove();

         }

        });

        

        //所属单位放大镜中的树形结构

        $("#belongOrgTreeGrid").treegrid({

            //title : "单位信息",

            width : "auto",

            //height : 510,

            nowrap : false,

            rownumbers : true,

            animate : true,

            collapsible : false,

            url : "${systemctx}/systemmanage/agency/queryTreeGridBelongOrg.json",

            idField : "id",

            treeField : "agencycodeandname",

            frozenColumns : [ [ {

                field : "agencycodeandname",

                title : "单位编号",

                width : 400

            } ] ],

            //columns : [[{field : "agencyname", title : "单位名称", 300 }]],

            queryParams:{ORGLEVELCODE: $("#loginOrgLevelCode").val(),AGENCYNAME:$("#belongOrg").val()},

            onBeforeLoad : function(row, param) {

                showSending(); //正在执行...

                $("#belongOrgH").val($("#belongOrg").val());

            },

            loadFilter:function(data,parentId){

             closeSending(); //关闭执行...

             closeSending(); //关闭执行...

                //设置每行记录的parentId

                var rows = data.rows;

             if(rows){

                 //若是采用了筛选查询,就不进行上下级的树形结构

                 if(rows[0].belongorglike!='-9'){

                     return data;

                 }

                 for(var i in rows){

                     if(rows[i].parentagencyid &&rows[i].agencylevel>rows[0].agencylevel)

                             rows[i]._parentId = rows[i].parentagencyid;

                 }

             }

             return data;

         },

         //双击一个节点进行选择,并关闭

         onDblClickRow: function(row){

                if(row)

                {

                    $("#belongOrg").val(row.agencycode);

                    $("#depositOrgName").val(row.agencyname);

                    $("#id_belongOrg").val(row.id);

                    $("#orgLevelCode").val(row.agencylevelcode);

                    if($("#belongOrgH").val()!=$("#belongOrg").val()){

                     $("#depositOrgNameView").text($("#depositOrgName").val());

                 }

                    $('#belongOrg_div').window('close');

                }

            },

            onLoadSuccess : function(row, data) {

            }

        });

    }

  • 相关阅读:
    使用熔断器防止服务雪崩
    创建服务消费者(Feign)
    1.python进行if条件相等时候的条件
    理解编程语言是什么
    硬件架构与操作系统的历史
    centos7 下安装rpm的mysql 5.7
    BIND的进阶二:视图,日志,转发,子域的授权
    Linux启动盘-ultraiso
    ubuntu 跟xshell的问题
    Python接口自动化-requests模块之get请求
  • 原文地址:https://www.cnblogs.com/daguozb/p/11585216.html
Copyright © 2011-2022 走看看