I dynamically added tabs as the following way:
tabpgIndex++;
href="#tabpg"+tabpgIndex;
var title = 'New Tab-'+tabpgIndex;
$('#tabs').append('<div id="tabpg'+tabpgIndex+'">{content}</div>'); //you can add your content here, or any dynamic content you want after this body've been build.
$('#tabs').tabs( 'add', href, title); //jquery ui tab method
$('#tabs ul li a span').last().prepend('<span id="closeicon-'+tabpgIndex+'" class="ui-icon ui-icon-circle-close" style="float:right; cursor: pointer;"></span>'); // prepend the close icon with an id, so it attached to the right of the tab title without a line break
//with the id I given, I managed a click event to it, like this:
$('#tabs ul li a').on('click','#closeicon-'+l_tabpgIndex,function(){
alert('close icon clicked');
//close this tab.
});
I don't know whether it works for you or not in your case, but it works for me, and hope it will work for you too.
No comments:
Post a Comment