MVC go to specific tab using Jquery

Question

I am doing this in .net MVC 4 & I have made tabs using

<div id="tabs">
<ul>
    <li><a href="#tab-1">Tab 1</a></li>
    <li><a href="#tab-2">Tab 2</a></li>
    <li><a href="#tab-3">Tab 3</a></li>
    <li><a href="#tab-4">Tab 4</a></li>
</ul></div>

I want to go in a specific tab for example in (Tab 4), I am using this line of code but no Success, here (".btn") is the class when the link is clicked.

<script type="text/javascript">
        $(".btn").click(function () {
        $("#tabs").tabs('select', "#tab-4");
        });
</script>

I have also used some thing like this: $("#tabs").tabs({"option", "", 3});

Please tell me the raight way to get rid of this.

Waxler

Answer 1

From the docs, the option you are looking for is active:

{ active: index }

Where index is a zero-based index. So your code needs to be:

$(".btn").click(function () {
    $("#tabs").tabs({ active: 3 });
});

Here is a fiddle of the above.

Sill

Dear I tried this also, but again same, it not worked, and thanks to answer. – Waxler

plz tell me where to write { active: index } – Waxler

I am getting alert, but it does not go my specifeid tab. – Waxler

Might be it working in Jquery, I am using this line of code in a VIew of my MVC application. – Waxler

I used this and it did not work, $("#tabs").tabs({ active: 3 }); – Waxler

Doing so I a getting this result, alert($("#tabs").tabs({ active: 3 })); [object Object] plz tell any solution @RGraham – Waxler