Problems using Tabs in a Dialog populated from a Template
I am attempting to use three jQuery plugins to render some templated content that should include tabs within a dialog. I am using jQuery.tmpl() for the template along with Tabs and Dialog from jQuery UI. The problem I have is to do with context in that setting the selector to an id of the <div> to make tab-able only works on the first attempt.
To understand what I am on about, please check out the following code which is missing the references to jquery.js, jquery-ui.js and jquery.tmpl.js:
Clicking the dialogify link for the first time will display the content as expected, but subsequent times do not. I have tried playing around with using a selector other than '#tabs' (such as by className) as well as dynamically adding tabs but I could not seem to get this working.
Any advice on what else I could try would be appreciated!
Thanks but it is not the click() event that is firing incorrectly. It is the rendering of the dialog contents into tabs that is the problem. This may be replicated without using the tmpl() plugin as follows:
Been playing about with this for a while, but I'm not sure I fully understand what it is you're trying to do. On clicking the dialogify button this should create a dialog with tabbed content, which is copied from #tabs (here as a normal div, but otherwise as a template) - is that right?
The problem I'm seeing is that because #tabs is cloned, the divs containing the tabbed content are also cloned and hence there are multiple divs with the same id including tab content - so the tabs in the dialog don't work.
Logic here: Initialise a counter to record the number of dialogs open (assuming there could be many). When the html is cloned, amend the ids of the anchors and divs to append the dialogCounter (so then they all have unique ids), and increment the dialogCounter. Remove the class of 'tabs' to stop the newly created element being cloned on a second or subsequent dialogify click.
html:I changed the id on the template to a class and added a content class to the content divs just to make things easier to manipulate.
This seems to work for me OK. It also seems ever so slightly clunky...
What else is there to do on a wet Saturday? Are you in WY too then?