how to stay in the same jquery ui tab after insertion in asp.net mvc 3?

Question

I have used jquery ui tab effect. What I am trying is to insert data into a model..it works perfectly..I can insert record..but my question is how to stay on the same tab after insertion ?can I do it from the controller ? I am trying to do it in my asp.net mvc 3 application

Here goes my Tab calling portion:

<script>
    $(function () {
        $("#tabs").tabs();

    });
</script>


<div id="tabs">
<ul>

<li><a href="#tabs-2">Proin dolor</a></li>
<li>@Html.ActionLink("Create Student","CreateStudent")</li>
<li>@Html.ActionLink("Student Details", "StudentDetails")</li>

</ul>
</div>

Here goes the student details tab:

@model IEnumerable<accordionNtabs.Models.student>


<table>
    <tr>
        <th>
            name
        </th>
        <th>
            birthdate
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.birthdate)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id = item.id }, new { id = "privacyLink" }) |
            @Html.ActionLink("Details", "Details", new { id=item.id }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.id }) |

        </td>
    </tr>
}



</table>

Here goes the Edit view which is rendered on clicking on the Edit link:

@model accordionNtabs.Models.student

@using (Html.BeginForm()) { @Html.ValidationSummary(true) student

    @Html.HiddenFor(model => model.id)

    <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 class="editor-label">
        @Html.LabelFor(model => model.birthdate)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.birthdate)
        @Html.ValidationMessageFor(model => model.birthdate)
    </div>

    <p>
        <input type="submit" value="Save" />
    </p>
</fieldset>

}

@Html.ActionLink("Back to List", "Index")

I want the edit view to be loaded on the same tab.

what does `how to stay on same tab` mean? Show your code and identify what part of code is causing problems — charlietfl, Mar 03 '13 at 14:10
what does `load in same tab` mean?. Please put more effort into explaining what you are trying to do in more explicit terms. It is not clear if you have problems with your server code or with client code and what will trigger this loading — charlietfl, Mar 03 '13 at 14:32

score 2 · Accepted Answer · edited May 23 '17 at 12:27

2

Sounds like you're doing a postback and then the page refreshes.. no ajax right? In that case, you need to use a hidden field or something else to record which tab was selected and then when you redisplay your form, you will need to set the selected tab by javascript. See this answer for ideas...: Selecting a jQuery Tab using a parameter in the URL

edited May 23 '17 at 12:27

Community

1
1

answered Mar 03 '13 at 14:15

Matt

6,787
11
65
112

score 0 · Answer 2 · answered Feb 09 '14 at 23:43

This is the sort of functionality that asp.net webforms provided via viewstate. Unfortunately with asp.net MVC the developer needs to take care of this by writing some code. You can maintain this state in cookies but beware that user may disable cookies. Alternatively you can use HTML5 web storage objects to store the UI state.

how to stay in the same jquery ui tab after insertion in asp.net mvc 3?

2 Answers2