jPanel by Deepu KS deepu.ks@tcs.com, d4udts@gmail.com
Copyright (c) 2012 Deepu KS
Dual licensed under the MIT and GPL licenses:
http://www.opensource.org/licenses/mit-license.php
http://www.gnu.org/licenses/gpl.html
Version 1.3.2 08.03.2012
You've downloaded components and a theme that are compatible with jQuery 1.4+. Please make sure you are using jQuery 1.4 + in your production environment.
Styles from jQuery UI is applied by default download a jQuery UI theme or define styles in the jPanel.css file.
Any container element can be used to make a panel eg: DIV, FORM, SPAN etc.
This HTML file have the worst mark up you could see :P plz forgive me for that as this one is generated by a WYSIWYG editor :) saves a lot of time you know :D
For more details visit jPanel SiteOption | Type | Description | Values | Dependencies | Default |
effect |
String | Use specified values for animation effect while opening and closing the panel, use none to disable animation |
slide, fade or none | none | slide |
speed | String | Use to specify animation speed | slow, fast or medium |
effect must not be none |
medium |
easing | String | Use to specify animation easing | none,swing or linear | effect must not be none | none |
cookie | boolean | Enable to retain panel state using cookie, by default state is preserved over session, to extend over days use @option cExpires to provide no. of days or a date. Note: To use cookies every Div used for panels has to have a unique ID |
true or false | id attibute of the div used |
false |
cExpires |
Object |
Either an integer specifying the expiration date for cookies from now on in days or a Date object. If a negative value is specified (e.g. a date in the past), the cookie will be deleted. If set to null or omitted, the cookie will be a session cookie and will not be retained when the the browser exits. |
Integer number or Date object |
cookie must be set to true |
null |
remoteDiv |
boolean | Enable to use ajax loading of content into the div from the specified href @attribute, if a target @attribute is set then data will be loaded there else data in the actual div will be overwritten. If a formids @attribute (multiple values separated by comma)is specified then the forms in the page with the id in formids will be serialized and sent as data in the ajax request. Note: The href @attribute is mandatory for ajax loading to work, provide action name in href, request will be sent as GET, both target @attribute and formids @attribute are optional. |
true or false |
href attribute must be set on the div used for panel |
false |
ajaxTimeout | number | Set to override the timeout for the ajax request |
time in milliseconds |
remoteDiv must be set to true | 30000 |
defaultView | String | Set to specify the default panel view |
panel or tab |
none | panel |
switchView | boolean | Enable to render a toggle button to switch between tab view and accordion view | true or false | none |
false |
retainView | boolean | Enable to retain panel view state(Tab or Accordion) using cookie, by default state is preserved over session, to extend over days use @option cExpires to provide no. of days or a date. Note: To use cookies every Div used for panels has to have a unique ID |
true or false | id attibute of the div used, cookie and switchView must be set to true |
false |
Attribute | Type | Description | Values | Dependencies | Default |
href/action |
String | Use href attibute to provide the url, page or action from where content has to fetched in remoteDiv mode. Note: This attribute is mandatory for Remote content loading. href has precedence over action attribute |
action or url in same domain | remoteDiv must be set to true | none |
target | String | Use to specify a different target than the same Panel. Note: If target is not specified the inner contents of the panel will be replaced by remote content. |
target element id where the remote content will be loaded |
remoteDiv must be set to true and href attribute must be set on the div used for panel | self |
formids | String | Use to specify which form data to be serialized and sent for remote data loading. Note: All the data will be encoded and sent. |
comma separated id's of the forms to serialize | remoteDiv must be set to true and href attribute must be set on the div used for panel | none |
method | String | Use to specify a request method type for ajax. | GET or POST | remoteDiv must be set to true and href attribute must be set on the div used for panel | GET |
id |
String | The id for the panel, used as key for cookies. Note: It is mandatory for cookies to work. |
any string |
none |
none |
title |
String | The Title to be rendered on the panel. |
any string |
none |
none |
Simple panel with default settings.
Simple panel with fade effect and slow animation with easing set to swing.
Simple panel with cookie set to true and cookie expiry set to 2 days.
Simple panel with remote data loading.
Panel with remote data loaded into a target. The content is loaded via ajax into the target specified (Target can be within or outside the actual panel).
Panel with remote data loading. The content is loaded from a different
source via ajax through POST and the specified form data are sent to the href
url as data.
The ajaxTimeout option allows you to set time out in milliseconds for the request.
This is a simple panel set formed from a SPAN, div and form element, it has switch view and retain view set to true and the default view is set to Tab hence on initial load it will render as Tabs and will retain the view state on subsequent loads as cookie and retain view is set to true