CODEWITHSUNDEEP
asp.netjquery-ui
DrZ
DrZ

Reputation: 181

Using jQuery UI and .Net Master pages

I would like to try and use jQuery UI along side of master pages in ASP.Net 4.0; I like the widgets better than the .Net controls. But I have a question around the accordion control.

Is it possible to put an accordion control in the master page and use it like a menu and still allow it to retain it's selected panel? In other words, each time a page is loaded, the ready() event triggers in the master page and resets the accordion. If I have panel 3 open, and select an item in the panel, I would like panel 3 to remain open when the new content is loaded.

I was thinking I only want to to the jQuery ready function on the initial load of the master page but I can't seem to make that happen.

I hope this makes sense.

Thank you

Upvotes: 3

Views: 621

Answers (5)

Brady Holt
Brady Holt

Reputation: 2934

Do you have to do full page postbacks? If not then you could use ajax from the client to interact with the server and avoid having to keep the accordian's state. Using the UpdatePanel is 1 option for this. Also, you could add a hidden input field to the form and set its value prior to posting back. Then on the server you can use ClientScriptManager to emit the necessary jQuery call to set the accordian's state back to what it was before the postback.

Upvotes: 0

mikemanne
mikemanne

Reputation: 3575

You could use an asp:Hidden field to hold the "currentOpenAccordionPanel". I'm sure there's a jQuery event you can hook to update that field whenever a different panel is opened. Then your page-init code can check that field and open that panel (or open a default panel if that field is empty or absent).

Because its an asp:Hidden field, the value will remain stable through postback operations (it will live in the viewstate), which is what it sounds like you wanted.

I like this approach a little better than a Session-based approach or cookie-based approach: if a user has multiple browsers/tabs open on your site, they will stomp each other's values if you store the value in a common location (like session or cookie). Viewstate-stored data will still behave fine if the user has multiple tabs open.

Upvotes: 1

µBio
µBio

Reputation: 10758

  1. Make a "Content area" iframe. When a link on the accordian is clicked, load a different page in the iframe.

  2. or make a content area div, and on the accordian link click, make an ajax call to and load the new content there

Upvotes: 0

Icarus
Icarus

Reputation: 63966

Apparently you are not alone having this issue and most people are doing it the way this post explains it.

Upvotes: 2

Robert Noack
Robert Noack

Reputation: 1306

I'm not sure if this is a great answer or not, but you can probably use session variables and logic in the view to only render the accordion script on the first load. Set a session var to something, and check for that value on subsequent loads. If it's set, don't render the javascript code (?) There might be a better way.

Upvotes: 0

Related Questions