A menu issue

Hello guys,

How to highlight the current path when selecting a subitem on menubar ?

I could not find any familiar sample or related API to do this except the property item[n].Checked, but it seems to write recursively function to check or uncheck points of path.

Have any smarter resolution?

6 Replies

LK Lakxman Kumar C Syncfusion Team June 10, 2010 12:21 PM UTC

Hi Jeren,

Thank you for your interest in Syncfusion Products.

By default the Syncfusion Menu control in ASP.NET has the feature of highlighting the expanded menu items. You can test this by setting the autoformat for the Menu control. Kindly refer the sample link from below which shows this.

http://samples.syncfusion.com/ASPNET/8.2.0.18/Web/Tools.Web/samples/3.5/MenuPackage/Menu-AppearanceSettings/MenuSkins/cs/MenuSkins.aspx?args=2

Please let me know if any concerns.

Regards,
Lakxman Kumar C


JN jeren norman June 11, 2010 04:11 AM UTC

Thanks for your quick response.

But the highlight-current-page, I meant, is to keep in status of highlight on any menuItem after selecting, clicking and moving cursor out of that.


LK Lakxman Kumar C Syncfusion Team June 14, 2010 11:12 AM UTC

Hi Jeren,

Thank you for your update.

Currently we dont have a ready made property for this in our library, But this can be achieved by using the CSS. When any menu item is clicked, then in the 'ClientSideOnItemSelect' client event the current clicked item can be got and the css class for the clicked item and its parent can be set such that they appear to highlight the current path. Please try the above and let us know if any concerns.

Thank you for your interest in Syncfsion Products.

Regards,
Lakxman Kumar C


JN jeren norman June 15, 2010 09:50 AM UTC

Thanks, Lakxman.

Eventually, I carry out this case by below steps..
1. set the imagepath/imagehoverpath to be null
2. bind event itemselect
3. set property Checked to be true for all of parents of current node

The disadvantage is that menuitems own it imagepath nothing. hehe

Maybe, solution CSS-change would be another better choice, but it run JS's recursive code on client site...


JN jeren norman June 15, 2010 09:51 AM UTC

Thanks, Lakxman.

Eventually, I carry out this case by below steps..
1. set the imagepath/imagehoverpath to be null
2. bind event itemselect
3. set property Checked to be true for all of parents of current node

The disadvantage is that menuitems own it imagepath nothing. hehe

Maybe, solution CSS-change would be another better choice, but it run JS's recursive code on client site...


LK Lakxman Kumar C Syncfusion Team June 21, 2010 12:03 PM UTC

Hi Jeren,

Thank you for your update.

You could also use the CustomCSS ,to create your own CSS so as to highlight the color of the expanded menu item. For Ex: Setting the text color of the MenuItem in its Expanded css class. By this you will not need to change the css class explicitly in your sample. Kindly try the above and let us knwo if it works.

Thank you for your interest in Syncfusion Products.

Regards,
Lakxman Kumar C

Loader.
Up arrow icon