Monday, July 27, 2009

[jQuery] Re: switching jquery tabs in code behind(C#)

My aspx page:

<script type="text/javascript">
$(function() {

$('#date0').datepicker({
changeMonth: true,
changeYear: true,
yearRange: '-30:+0'


});

</script>

<div id="tabs">
<ul>
<li><a href="#tabs-1">All</a></li>
<li><a href="#tabs-2">Awaiting
Instructions</a></li>
<li><a href="#tabs-3">Waiting For
Upload</a></li>
<li><a href="#tabs-4">In Progress</
a></li>
<li><a href="#tabs-5">Seeking
Clarifications</a></li>
<li><a href="#tabs-6">Awaiting
Feedback</a></li>
<li><a href="#tabs-7">Completed</
a></li>
</ul>

<div id="tabs-1">
<asp:Button ID="btnInstruction1" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
<div id="tabs-2">
<asp:Button ID="btnInstruction2" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
<div id="tabs-3">
<asp:Button ID="btnInstruction3" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
<div id="tabs-4">
<asp:Button ID="btnInstruction4" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
<div id="tabs-5">
<asp:Button ID="btnInstruction5" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
<div id="tabs-6">
<asp:Button ID="btnInstruction6" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
<div id="tabs-7">
<asp:Button ID="btnInstruction7" runat="server"
Text="Instructions on the Selected Jobs" />
...Grid with some datas...
</div>
</div>


After clicking of a button in any tabs it stay on the same tab....For
example i'm clicking the button "btnInstruction7". which is inside the
tab-7. The tab-7 should be selected after the button click event....

My .aspx.cs page:

protected void btnSearch7_Click(object sender, EventArgs e)
{

....Some code here


string _tabSelected = "$(\"#tabs\").tabs('option',
'selected', 6);";

Page.ClientScript.RegisterClientScriptBlock(this.GetType
(), "startupTabScript", _tabSelected, true);

}

Its not working..The first tab get selected after that postback..Can
anyone tell me the solution for this...

On Jul 24, 12:02 pm, noorul <noorulameen...@gmail.com> wrote:
> Hi karngu, Here is the one of my tab: Can you send me the javascript
> to select this tab..
>
>  <div id="tabs">
>                                 <ul>
>                                     <li><a href="#tabs-1" style="font-
> size: 12px">All</a></li>
>                                 </ul>
>                                <div id="tabs-1">
>                                </div>
> </div>
>
> On Jul 24, 1:38 am, karnqu <jake.al...@gmail.com> wrote:
>
>
>
> > like morningZ said your probably looking for this...
> > ClientScript.RegisterStartupScript(typeof (<<page class name>>),
> > "startupTabScript", "<<javascript to select correct tab>>", true);
>
> > The pain is knowing what the last tab they selected was. But in your
> > case if the button they clicked was on that tab then it sounds pretty
> > straight forward.
>
> > On Jul 23, 1:34 pm, MorningZ <morni...@gmail.com> wrote:
>
> > > "onclick event" would be:
>
> > > - in the aspx'scode?
> > > - on the client?
>
> > > if it is in thecode, then any running of that postbackcodeis going
> > > to cause a page reload, and consequent defaulting to the first tab by
> > > default....
>
> > > if you want the new page reload to stay on the current tab, then you
> > > would emit some client script (using Page.ClientScript) object to call
> > > theTabs' event that will switch the tab
>
> > > On Jul 23, 9:49 am, noorul <noorulameen...@gmail.com> wrote:
>
> > > > I have five div tags(jquerytabs) in my aspx page...Inside the second
> > > > div(tab) i have a button. onclick of that buttton the second div(tab)
> > > > should be switched..instead of that the first tab is coming.. How can
> > > > i switch the tab incodebehind(Inside button onclick event)...

No comments: