CODEWITHSUNDEEP
jqueryajaxjquery-ui
user166891
user166891

Reputation: 139

jQuery UI inside ajax div

i have a site with links that look like this: onClick = ajax('link.html','contentdiv')

but i want to use jquery ui tabs inside the contentdiv, i tried even to put all the code inside the html but nothing, i tried:

$(document).ready(function() {
$("#tabs").tabs({});

and also:

$((function() {

what should i put in the index.html and the link.html to make it work? the #tabs div is inside the link.html

thanks

Upvotes: 0

Views: 1216

Answers (2)

Basit
Basit

Reputation: 17214

you dont have to do that anymore.. just simply use live method, which they created in new release, it will work on new div also

$('.newDiv').live('click', contendDiv);

EDITED: if you adding tabs inside ajax content after click, then do following

$('.newDiv').live('click', function () {
      // following can be ajax content or static content
      var content_div = '<div>...<div id="tab"></div..</div>';

      var selector = $(content_div);
      $(selector).find('#tab').tab({});
      return $(selector).html(); // add this in your final html content, it will have tabs ready.
});

Upvotes: 1

Mercurybullet
Mercurybullet

Reputation: 889

It sounds to me like your trying to initialize the tabs before they are available. $(document).ready() from index.html will happen far before the user clicks the link and starts the ajax.

Try using something along these lines to make the tabify method wait until the html is available.

onclick = ajax({
             url:     'link.html',
             success: function (html) {
                          $('#contentdiv').append(html);
                          $('#tabs, #contentdiv').tabs();
             }
          });

Upvotes: 0

Related Questions