HelpfulChad
New Member
I'm doing a work on JQuery UI tabs. I want to close a dynamically generated tab after form submission.This is my code:\[code\]function submit_form(){ alert(JSON.stringify($('form').serializeObject())); $('#result').text(JSON.stringify($('form').serializeObject())); var tabs = $("#container-1").tabs(); tabs.tabs('remove', 1);}$(document).ready(function(){ var tabs = $("#container-1").tabs(); $('#add_tab').click( function(){ var ul = tabs.find( "ul" ); $( "<li><a href='http://stackoverflow.com/questions/14597256/#newtab'>New Tab</a></li>" ).appendTo( ul ); $( "<div id='newtab'><form action='' method='post'>Name :<input type='text' name='name'></input></br>Email :<input type='text' name='email'></input></br>Phone Number :<input type='text' name='phone'></input></br><input type='button' value='http://stackoverflow.com/questions/14597256/Submit' id='form_button' onclick='submit_form()'></input></form></div>" ).appendTo( tabs ); tabs.tabs( "refresh" ); tabs.tabs( "option", "active", -1 ); });});\[/code\]My HTML page:\[code\]<body><div id="container-1"> <ul> <li><a href="http://stackoverflow.com/questions/14597256/#fragment-1">List</a></li> </ul> <div id="fragment-1"> <table id="contact"> <tr> <th> Name </th> <th>E-mail </th> <th> Phone </th> </tr> </table> </div></div>\[/code\]Add TabThe tab I want to close is dynamically created by the function \[code\]on-click of add_tab\[/code\]. I want to close it at the end of function \[code\]submit_form()\[/code\]. How to do it?