Question

I am quite new with MVC. I have a view with jQuery tabs (as bellow) on it.

<div class="demo">
<div id="demoTabs">
    <ul aria-labelledby="demoTabsLabel">
        <li><a href="#basicInfo">Basic Information</a> </li>
        <li><a href="#address">Address</a> </li>
        <li><a href="#tabbs">Tab 3</a> </li>
    </ul>
    <div id="basicInfo">
        @using (Html.BeginForm("Create", "Organisation", FormMethod.Post)) {
        <div class="editor-label">
            @Html.LabelFor(model => @Model.Name)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => @Model.Name) @Html.ValidationMessageFor(model => @Model.Name)
        </div>
        <div>
            <a class="nexttab" href="#address">
                <input id="Submit2" type="submit" value="Continue" /></a>
        </div>
        }
    </div>
    <div id="address">
        @Html.Label("Address") <a class="nexttab" href="#tabbs">
            <input id="Submit4" type="submit" value="Continue" /></a>
    </div>
    <div id="tabbs">
        @Html.Label("optional") </fieldset>
        <input id="Submit5" type="submit" value="Submit" />
    </div>
</div>

When the user press the continue button control moves to the next tab using the script bellow.

$("#demoTabs").tabs();
$(".nexttab").click(function () {
    $("#demoTabs").tabs("select", this.hash);
});

But when the request comes back from controller after saving the information, it reloads the page and moves the control to first tab again.

Can you please suggest me the right way of doing?

Many thanks

Controller

[HttpPost]
public ActionResult Create(Xrm.Account account)
{
    //create
    org = orgModel.CreateOrUpdateOrg(account);
    return Redirect(Url.Action("Create", "Organisation") + "#tabbs");           
}

Answer 1

In your controller, use this line to return to your ActionResult. You’ll need to append the correct tab name at the end:

return Redirect(Url.Action("Action", "Controller") + "#tabname");

Then in your page, add this code to show the right tab on load:

$("#demoTabs").tabs("select", window.location.hash);