Query Panel (searchbar) that can be scaled in the dwz (Jui) Tutorial)

Query Panel (searchbar) that can be scaled in the dwz (Jui) Tutorial)

This kind of requirement has been raised recently. A page has many query conditions, which occupy a large amount of space if all are displayed at a time. Therefore, it is divided into two categories: simple search and advanced search, when you click Advanced search, all entries are displayed.

In this way, there is a problem. The height of the pageheader panelbar on and off the page (navtab, DIALOG) is determined by the layouth value. If the panel is higher, the following paging labels will be supported,

The solution is to retrieve the front and back height differences when the searchpanel height is changed. Modify the layouth value of the current page element and layout again.

$ ("Document "). ready (function () {$ ("# gjjs "). click (function () {$ this = $ (this); var YH = $ ("# workplan_search "). height (); if ($ this. text () = 'advanced search') {$ this. text ('simple search')} else {$ this. text ('advanced search')} $ ("# 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 ;});});

The above is before and after the change, and I hope it will help you.