可以伸缩的查询面板 (searchBar)
最近有这样的需求,一个页面查询条件特别多,一次全部展示出来的话就占用大量的空间,所以分成了两类,简单搜索和高级搜索,当点击高级搜索的时候就会全部显示。
这样就存在一个问题,页面(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)的更多相关文章
- Ext查询面板收缩时,文本内容垂直显示
css添加如下样式/***查询面板收缩时,文本内容垂直显示**/.x-layout-collapsedText{ width:16px; font-size:11px; word-wrap:break ...
- ExtJS4 自己定义基于配置的高级查询1
今天在编码过程中遇到一个问题,临时还没解决,先记录下来 上面是我做的高级查询面板..字段名和值都是读取配置文件,依据用户选择不同的字段名,自己主动载入不同的值列表,关系是与或 问题来了,我在字段名那个 ...
- 利用WPF建立自己的3d gis软件(非axhost方式)(九)SDK自带部分面板的调用
原文:利用WPF建立自己的3d gis软件(非axhost方式)(九)SDK自带部分面板的调用 先下载SDK:https://pan.baidu.com/s/1M9kBS6ouUwLfrt0zV0bP ...
- [译]SSAS下玩转PowerShell(二)
上一篇中简单的介绍了SSAS下的PowerShell,这一篇会演示更多的操作,比如根据当前时间创建备份,使用变量去指定处理哪一个分区,以及用XMLA脚本去创建分区,和在PowerShell中调用Pow ...
- Linux终端杀手、程序员利器-Tmux
Send article as PDF SA.Coder.经常远程.还在开一堆终端?试试 Tmux 吧,一个窗口就搞定. 目录 0.0.0.1 Tmux ? Tmux 是一个终端复用 ...
- 报表性能优化方案之单数据集分页SQL实现层式报表
1.概述 我们知道,行式引擎按页取数只适用于Oracle,mysql,hsql和sqlserver2008及以上数据库,其他数据库,如access,sqlserver2005,sqlite等必须编写分 ...
- SQL Server 2014 BI新特性(一)五个关键点带你了解Excel下的Data Explorer
Data Explorer是即将发布的SQL Server 2014里的一个新特性,借助这个特性讲使企业中的自助式的商业智能变得更加的灵活,从而也降低了商业智能的门槛. 此文是在微软商业智能官方博客里 ...
- Mac键位设定和Xcode快捷键(自己总结,持续更新)
一. Xcode实用快捷键: Cmd + b 编译 Cmd + r 运行 Cmd + z ...
- SQL Server 2014新特性:五个关键点带你了解Excel下的Data Explorer
SQL Server 2014新特性:五个关键点带你了解Excel下的Data Explorer Data Explorer是即将发布的SQL Server 2014里的一个新特性,借助这个特性讲使企 ...
随机推荐
- 什么是双线双IP,什么叫双线双IP
双线双IP实现双线路,拥有中国电信.中国网通骨干网的接入,在该机房托管的服务器,实现了电信和网通的双线路接入,使电信和网通的用户都能以非常快的速度连接到服务器,解决了电信和网通互相访问速度慢的问题.这 ...
- java建立二叉树,递归/非递归先序遍历,递归/非递归中序遍历,层次遍历
import java.util.LinkedList; import java.util.Scanner; import java.util.Stack; //structure of binary ...
- C++ Code_Slider
主题 1. 滑块控件属性设置 2. 使用滑块控件设置颜色 3. 显示Slider的数值 4. 5. 属性 滑块控件属性设置 //代码设置属性 代码:: ////////////// ...
- WCF入门教程(三)属性标签
属性标签,成为定义协议的主要方式.先将最简单的标签进行简单介绍,以了解他们的功能以及使用规则. 服务协定标识,标识哪些接口是服务协定,哪些操作时服务协定的一部分,以及传输对象的定义.如果已经有所了解, ...
- 【JavsScript】webapp的优化整理
单页or多页 webapp 现状 优劣之分 网络传输优化 综述 fake页-首屏加速 降低请求数 降低请求量 缓存Ajax/localstorage DOM操作优化 综述 关于页面渲染 减少使用定位属 ...
- 编辑器TP
http://www.itshipin.com/blog/archives/category/php/thinkphp
- Mongodb集群配置(sharding with replica set)
转自:http://blog.csdn.net/zhangzhaokun/article/details/6269514 前言 最近在研习MongoDB集群,找到一个不错的例子,加了几句,按照自己的理 ...
- JS比较两个数值大小的正确方法
转自:http://www.zzsky.cn/build/content/1832.htm 一般情况下: <script type="text/javsscript"> ...
- 修改FFMpeg源码—捕获丢包
概述 最近我们项目有一个需求就是解决客户端播放RTSP视频流花屏的问题,一般来说丢包就会引起花屏,导致客户端花屏的因素又有很多,比如说: 相机到服务器丢包 服务器到客户端丢包 等等... 其中服务器到 ...
- LOG4NET开源日志dll引用流程,在net3.5中已经实践ok
一,在app.config中配置 <?xml version="1.0"?><configuration> <configSections> & ...