最近有这样的需求,一个页面查询条件特别多,一次全部展示出来的话就占用大量的空间,所以分成了两类,简单搜索和高级搜索,当点击高级搜索的时候就会全部显示。

这样就存在一个问题,页面(navTab,dialog)上下pageHeader panelBar 高度是有 layoutH值决定的,如果上面的面板变高,就会把下面的分页标签撑出,

解决的方法就是 当改变searchpanel的高度时,获取前后的高度差,修改当前页面元素的layoutH值重新layout一下。

 $("document").ready(function(){
$("#gjjs").click(function(){
$this = $(this);
var yh = $("#workplan_search").height();
if($this.text()=='高级检索'){
$this.text('简单检索')
}else{
$this.text('高级检索')
}
$("#workplan_search .complex").toggle();
var xh = $("#workplan_search").height(); var $panel=$this.parents('.unitBox:first').find("[layoutH]").each(function(){
$(this).attr("layoutH",parseInt($(this).attr("layoutH"))+(xh-yh));
$(this).layoutH();
}); return false;
});

以上是改变前后的效果图

可以伸缩的查询面板 (searchBar)的更多相关文章

  1. Ext查询面板收缩时,文本内容垂直显示

    css添加如下样式/***查询面板收缩时,文本内容垂直显示**/.x-layout-collapsedText{ width:16px; font-size:11px; word-wrap:break ...

  2. ExtJS4 自己定义基于配置的高级查询1

    今天在编码过程中遇到一个问题,临时还没解决,先记录下来 上面是我做的高级查询面板..字段名和值都是读取配置文件,依据用户选择不同的字段名,自己主动载入不同的值列表,关系是与或 问题来了,我在字段名那个 ...

  3. 利用WPF建立自己的3d gis软件(非axhost方式)(九)SDK自带部分面板的调用

    原文:利用WPF建立自己的3d gis软件(非axhost方式)(九)SDK自带部分面板的调用 先下载SDK:https://pan.baidu.com/s/1M9kBS6ouUwLfrt0zV0bP ...

  4. [译]SSAS下玩转PowerShell(二)

    上一篇中简单的介绍了SSAS下的PowerShell,这一篇会演示更多的操作,比如根据当前时间创建备份,使用变量去指定处理哪一个分区,以及用XMLA脚本去创建分区,和在PowerShell中调用Pow ...

  5. Linux终端杀手、程序员利器-Tmux

        Send article as PDF      SA.Coder.经常远程.还在开一堆终端?试试 Tmux 吧,一个窗口就搞定. 目录 0.0.0.1 Tmux ? Tmux 是一个终端复用 ...

  6. 报表性能优化方案之单数据集分页SQL实现层式报表

    1.概述 我们知道,行式引擎按页取数只适用于Oracle,mysql,hsql和sqlserver2008及以上数据库,其他数据库,如access,sqlserver2005,sqlite等必须编写分 ...

  7. SQL Server 2014 BI新特性(一)五个关键点带你了解Excel下的Data Explorer

    Data Explorer是即将发布的SQL Server 2014里的一个新特性,借助这个特性讲使企业中的自助式的商业智能变得更加的灵活,从而也降低了商业智能的门槛. 此文是在微软商业智能官方博客里 ...

  8. Mac键位设定和Xcode快捷键(自己总结,持续更新)

    一. Xcode实用快捷键: Cmd + b                     编译 Cmd + r                      运行 Cmd + z               ...

  9. SQL Server 2014新特性:五个关键点带你了解Excel下的Data Explorer

    SQL Server 2014新特性:五个关键点带你了解Excel下的Data Explorer Data Explorer是即将发布的SQL Server 2014里的一个新特性,借助这个特性讲使企 ...

随机推荐

  1. ARM&Linux 下驱动开发第三节

    后台驱动代码如下:比较昨天的,添加了读写指针位置移动操作 #include<linux/init.h> #include<linux/module.h> #include< ...

  2. java list三种遍历方法性能比較

    从c/c++语言转向java开发,学习java语言list遍历的三种方法,顺便測试各种遍历方法的性能,測试方法为在ArrayList中插入1千万条记录,然后遍历ArrayList,发现了一个奇怪的现象 ...

  3. [Oracle] - 性能优化工具(2) - ASH

    ASH和AWR的关系 ASH以V$SESSION为基础,每秒採样一次,记录活动会话等待的事件.不活动的会话不会採样,採样工作由新引入的后台进程MMNL来完毕. ASH内存记录数据始终是有限的,为了保存 ...

  4. Javascript实现鼠标框选元素后拖拽被框选的元素

    之前需要做一个框选元素后拖拽被框选中的元素功能,在网上找资料做了一些修改,基本达到了需要的效果,希望对也需要实现框选后拖拽元素功能的人有用. 页面加载后效果 框选后的内容可以拖拽,如下图: 代码下载

  5. 深入理解 CSS 中的行高与基线

    1.基本概念 1.  基线.底线.顶线.中线 注意:基线(base line)并不是汉字文字的下端沿,而是英文字母“x”的下端沿. 2. 内容区 内容区是指底线和顶线包裹的区域(行内元素display ...

  6. java 访问修饰符

    此题考察修饰符,函数定义等,故从网上搜罗了下相关资料,总结如下: 类.方法.成员变量和局部变量的可用修饰符 修饰符 类 成员访求 构造方法 成员变量 局部变量 abstract(抽象的) √ √ - ...

  7. IOS 使用webview 显示 doc/docx/xls/pdf等

    在一款项目里添加阅读各种文档功能 那么对在线的文档或者是下载后的文档 进行阅读,比如 doc/docx/xls/pdf等文件 有两种方法总结如下: 1. - (void)viewDidLoad { [ ...

  8. [原创] Web UI自动化应用测试框架实践 - 概览

    之前为我们部门做的一个UI框架.不能纯粹解读为框架,主要是做了一些简单的分层设计,以解决稳定性.降低复杂性.提升可维护性以及快速构建测试用例等实际问题. 主要部分:1. 测试数据.主要提供测试类库需要 ...

  9. 社交分享:-canOpenURL: failed for URL: "weixin://app/*************/" - error: "This app is not allowed to query for scheme weixin"

    升级到iOS9后,微信,QQ,微博等社交软件的分享都失效了,控制台默默地打印了这条信息: This app is not allowed to query for scheme xxx 这是因为iOS ...

  10. jquery plugins —— datatables 搜索后汇总

    网上的例子 http://datatables.club/example/plug-ins/api.html只能对当前页面或所有数据进行汇总,不能对搜索结果数据汇总. 以下是对datatables自带 ...