Response title
This is preview!
tab closing is not working when i click to load the Tab more than one
in Using jQuery UI
•
11 years ago
Hi,
I am Loading/Initializing a Tab in a Ajax return. The problem is the tab closing is not working when i click to load the Tab more than one... here is the code..
$("#billtracker-search-searchbtn").bind('click',function(){
var Actionlink="/root/billtracke
$("#billtracker-search-resultdiv").mask("Searching Data... Please wait...");
$.ajax({
url: Actionlink,
type:"POST",
data:{
perform:"SearchPO",
bpaNumber:bpaNumber
},
cashe:false,
success:function(data){
$("#billtracker-search-resultdiv").unmask();
$("#billtracker-search-resultdiv").empty();
$("#billtracker-search-resultdiv").html(data);
var tab_counter = 2;
var tabcount=0;
var tabheading="";
var ActionUrl="/AshtecManager/root/billtracker.action";
var $tabs = $('#billtracker-search-tabs').tabs({
//<a href={href}>#{label}</a>
tabTemplate: '<li><a href=#{href}>#{label}</a><span class=\"ui-icon ui-icon-close\">Remove Tab</span></li>',
add: function(event, ui) {
$(ui.panel).load(ActionUrl,{
'perform':'NewTab'
});
$tabs.tabs('select', '#' + ui.panel.id);
}
});
$('#billtracker-search-tabs span.ui-icon-close').live('click', function() {
var index = $('li',$tabs).index($(this).parent());
$tabs.tabs('remove', index);
tabcount--;
});
function addTab(){
$tabs.tabs('add', '#billtracker-search-tabs-'+tab_counter,tabheading);
tab_counter++;
tabcount++;
}
$("a.clicka").bind('click',function(){ // this <a> tag is placed in first tab
tabheading="More";
//alert("hi");
addTab();
});
}
});
});
This is the Error showing in Firefox error console:
Error: uncaught exception: cannot call methods on tabs prior to initialization; attempted to call method 'remove'
1