Jquery Tab Widget Losing Formatting
I built this same tabbed system using PHP and it works great, now I am trying to get it to work as Jquery and am *almost* there!
I am trying to load my well-formatted JSON data into a tabbed structure. So far the data is in and showing up where it should. My problem is that the style is being dropped from the li element and I believe it is because of how I set up my javascript in the JQuery.each section. Does anyone have any idea how I can fix this? Here is the function I use to callback the data:
I am trying to load my well-formatted JSON data into a tabbed structure. So far the data is in and showing up where it should. My problem is that the style is being dropped from the li element and I believe it is because of how I set up my javascript in the JQuery.each section. Does anyone have any idea how I can fix this? Here is the function I use to callback the data:
function searchCallback(data) {var content_data = data.content_data.records;jQuery.each(content_data, function(index, content_dat) { jQuery("#tabs ul").append('<li><a href="#tabs-'+
content_dat[0]+'">' + content_dat[2] + '</a></li>'); jQuery("#tabs ul").after("<div id='tabs-"+
content_dat[0]+"'>"+content_dat[1]+"</div>"); }); }; </script> <div id="tabs"><ul></ul> </div>
The div id="tabs" becomes div id="tabs" class="ui-tabs ui-corner-all ui-widget ui-widget-content" just like it is supposed to...
and the ul becomes ul class="ui-tabs-nav ui-corner-all ui-helper-reset ui-helper-clearfix ui-widget-header" role="tablist" just like it is supposed to...
but the li remains li and does not pick up the class it is supposed to...
I am thinking this may have something to do with the way Jquery is appending to the #tabs ul so the li is not available for transforming, but I am not sure...
Topic Participants
laura-long
jakecigar