Saturday, March 24, 2012

ASP Menu Control & AJAX Tab Control

Hi,

I have a menu control on my master pages. When I click on a menu I would like the Tabs on the Tab Control to change accordingly.

How do I go about in doing this? The Tab Control is on the ContentPlaceHolder (Default.aspx).

Thanks much appreciated.

Any1 Please !!!!

i have same problem..smbdy please help!!


This is what I have so far ......!!!

Im accessing the TabControl on the Default.aspx & this code does not work. I get NO errors thou. Am I doing something wrong?

protectedvoid MenuItem_Click(object sender,MenuEventArgs e)

{

if (this.Menu1.SelectedItem.Value.Equals("1"))

{

TabContainer myTabContainer = (TabContainer)this.ContentPlaceHolder1.FindControl("TabContainer1");

TabPanel myTabPanel2 = (TabPanel)this.ContentPlaceHolder1.FindControl("TabPanel2");

myTabContainer.ActiveTab = myTabPanel2;

}

}


I would like to change the tabs on the client side with no post backs. Any1 knows of a javascript that can help with this?

Please peeps....... Im willing to pay for this answer !!

Any Master minds out their ?


Here you go ,

<scriptlanguage="javascript">function changeTab( tabIndex ){var tabBehavior = $get('<%=TabContainer1.ClientID%>').control;

tabBehavior.set_activeTabIndex(tabIndex);

}

</script>

Remember to mark my reply as the answer .!!!

Happy coding !!!


Thanks sooooooooo much !!!

How do I add this function to a click event on the asp.net menu control.


Please note that Tab Control is on Default.aspx & Menu control is on MasterPage

Hi,

To solve this problem use AJAX Control Toolkit.

Use TabPanel toolkit in that.I think this will help u.


I am using the AJAX TabControl what do you mean?

Does any1 know how I can add this if the asp menu is on the master pages & the TabControl is on the ContentPlaceHolder (Default.aspx).

This function should fire every time a link is clicked on the menu.

<scriptlanguage="javascript">

function changeTab( tabIndex ){

var tabBehavior = $get('<%=TabContainer1.ClientID%>').control;

tabBehavior.set_activeTabIndex(tabIndex);

}

</script>


Here is how I would approach this.

In the code-behind for Default.aspx, I would emit a javascript function like your changeTab one, but I would call it

Menu1_MenuItemClicked_Listener

It would take a parameter indicating the menu item that was clicked. This could be a number, name or whatever you would use to distinguish between menu items. Your function would make the appropriate tab active based on the menu item that was clicked.

In the HTML of the master page, I would add a function like so:

<script>

function Menu1_MenuItemClicked(menuItem)

{

if (Menu1_MenuItemClicked_Listener)

Menu1_MenuItemClicked_Listener(menuItem);

}

</script>

Essentially, if your content page has defined a listener, it will be invoked. If not, no worries.

Then, in the code behind of the master page, I would add an attribute to each menu item like so:

MenuItem1.Attributes["onclick"] = "javascript: Menu1_MenuItemClicked('menuItem1');";

This will cause the menu item to invoke the master page's event handler.

I would also change the menu item's href to "javascript: return false;" so it doesn't invoke a postback.


HI, Thanks for the help.

Am I doing this right as im getting errors. I added this line to the Menu1_MenuItemClick event of the menu control like this.....

protected

void Menu1_MenuItemClick(object sender,MenuEventArgs e)

{

MenuItem1.Attributes["Item1"] = "javascript: Menu1_MenuItemClicked('menuItem1');";

}

Another thing, How does the script function nows what tab to change to ?

No comments:

Post a Comment