如何在jQuery UI标签中提交表单上的选定标签

Question

In my MVC application Im using jquery UI tabs (jquery-ui-1.9.0) and setting a tab selected using the script below

<script type="text/javascript">
$(document).ready(function () {
    $( "#tabs" ).tabs({ selected: @Convert.ToInt32(Model.SearchModel.SearchType) })
});

<div id="tabs">
 <ul>
   <li><a href="#articlesearchtab">Article</a></li>
   <li><a href="#othersearchtab">Other</a></li>
 </ul>

<div id="articlesearchtab">
   //content
</div>

<div id="othersearchtab">
   //content
</div>

User can go into either tab and update content. I need to get the content of selected tab on form submit. How can I get know the tab where user has selected?

Answer 1

In jQuery UI 1.9, the selected option is deprecated:

Deprecated selected option; renamed to active

(#7135) The selected option has been renamed to active for consistency with other plugins in jQuery UI. You should replace all uses of the selected option with the active option.

The selected option will be removed in 1.10.

Here is the new way to get the current tab:

Boolean: Setting active to false will collapse all panels. This requires the collapsible option to be true. Integer: The zero-based index of the panel that is active (open). A negative value selects panels going backward from the last panel.

Code examples:

Initialize the tabs with the active option specified:

 $( ".selector" ).tabs({ active: 1 }); 

Get or set the active option, after initialization:

 // getter var active = $( ".selector" ).tabs( "option", "active" ); // setter $( ".selector" ).tabs( "option", "active", 1 ); 

Answer 2

Simply, Call Same tabs in javascript using Code behind where you submit the form.

<script type="text/javascript" language="javascript">
    function OpenMoreDetails(id) {
        document.getElementById(id).style.display = 'block';
        return false;
    }
</script>

protected void btnAttachDocument_Click(object sender, EventArgs e)
{

    //your code     
    ScriptManager.RegisterStartupScript(this, GetType(), "attach",  "OpenSearchOption('yourtabid',this);", true);
}