zoukankan      html  css  js  c++  java
  • jq-Grid 能折叠的表格

    有一个需求是需要用jq-Grid展示一个可以折叠的表格,并且要求在页面初始化的时候就将表格折叠起来,我看了一下文档可以给列表增加 toolbar: [true, "top"],caption:"标题",可以实现,需要每次点击页面之后列表默认是展开的

     gridComplete: function () {
                            $("#newjqGrid").closest("#gview_newjqGrid").css({"overflow-x": "hidden"})
                            $("#newjqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
                            if ($("span.ui-jqgrid-headlink").hasClass("glyphicon-circle-arrow-up")) {
                                $("span.ui-jqgrid-headlink").removeClass("glyphicon-circle-arrow-up").addClass("glyphicon-circle-arrow-down")
                            }
                        },
    

    通过改变类名后,列表第一次会折叠,第二次失效,于是我又想到给元素添加点击事件,

     gridComplete: function () {
                            $("#newjqGrid").closest("#gview_newjqGrid").css({"overflow-x": "hidden"})
                            $("#newjqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
                            if ($("span.ui-jqgrid-headlink").hasClass("glyphicon-circle-arrow-up")) {
                                $("span.ui-jqgrid-headlink").trigger("click")
                            }
                        },
    

    这样还是达不到预期的效果,我在想是不是发生冒泡,所以没达到预期的效果,于是在if判断里面加了 return false 仍然达不到效果,于是我在切换元素类名的时候同时触发点击事件,最终达到预期的效果

     gridComplete: function () {
                            $("#newjqGrid").closest("#gview_newjqGrid").css({"overflow-x": "hidden"})
                            $("#newjqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
                            if ($("span.ui-jqgrid-headlink").hasClass("glyphicon-circle-arrow-up")) {
                                $("span.ui-jqgrid-headlink").removeClass("glyphicon-circle-arrow-up").addClass("glyphicon-circle-arrow-down")
                                $("span.ui-jqgrid-headlink").trigger("click")
                                return false
                            }
                        },
    
  • 相关阅读:
    2016.9.3 好好学习天天快乐解题报告
    2016.8.29 LGTB解题报告
    2016.8.29 解题报告之我会做的题都是简单题
    2016.8.28 随写
    2016.8.27一套简单的题解题报告
    2016.8.25 NOIP2012 day1 解题报告
    进度条君
    2016..8.25 切题总结
    2016.8.25 暑假总结
    dsu on tree学习笔记
  • 原文地址:https://www.cnblogs.com/rainbowqq/p/13445579.html
Copyright © 2011-2022 走看看