可以伸缩的查询面板 (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里的一个新特性,借助这个特性讲使企 ...
随机推荐
- android学习记录(十三)Task 和 Activity 回退栈操作。
首先说一下Task是一个什么概念吧:Task是一个包括activity的列表.没 错.简单的说就是依照启动的先后来排队的一个队列.Back Stack.就是回退栈的意思:那么有什么用?Back Sta ...
- CodeForces 164A Variable, or There and Back Again 搜索
Variable, or There and Back Again 题目连接: http://codeforces.com/problemset/problem/164/A Description L ...
- Codeforces Gym 100231L Intervals 数位DP
Intervals 题目连接: http://codeforces.com/gym/100231/attachments Description Start with an integer, N0, ...
- Educational Codeforces Round 4 B. HDD is Outdated Technology 暴力
B. HDD is Outdated Technology 题目连接: http://www.codeforces.com/contest/612/problem/B Description HDD ...
- C++ Code_animateCtrl
Code:: 播放 if (!m_animate1.Open("C:\\copy.avi")) { MessageBox("NULL& ...
- [MongoDB] Insert, find -- 1
MongoDB is JSON Document: How to start MongoDB client: mongod //start the server mongo // start the ...
- Android NDK: WARNING: APP_PLATFORM android-14 is larger than android:minSdkVersion 8
在使用Eclipse 直接编译NDK,有时候会报类似以下错误 Android NDK: WARNING: APP_PLATFORM android-14 is larger than android: ...
- JavaWeb学习总结
http://www.cnblogs.com/xdp-gacl/tag/JavaWeb%E5%AD%A6%E4%B9%A0%E6%80%BB%E7%BB%93/ http://www.cnblogs. ...
- 程序集、应用程序配置及App.config和YourSoft.exe.config .
转自:http://www.cnblogs.com/luminji/archive/2010/10/21/1857339.html 什么是程序集 程序集标识属性 强名称的程序集 强名称工作原理 配置文 ...
- 关于 ArtifactTransferException: Failure to transfer
eclipse 在导入maven project后,pom.xml有可能出现这种错误. 这里update maven project解决了:右键点击Maven项目->Maven->Upda ...