$find("MenuID") doesn't work in SharePoint

[STEMax]

Hi,

I'm facing a strange issue, in my WCM SharePoint website I use RadMenu instead of standard menu provided by Microsoft. Everything is great except that the menu doesn't highlight the good selected link in the menu. I think it's because I use relative links instead of absolute links (but as my website is accessed with different URLs I can't use absolute links). 

So, I decided that I will use clientside scripting to get the menu highlight the good items. This is the code I (thought I could) use :

	_spOnLoadBodyFunctionsNames.push("HighlightMenuItem"); //because SharePoint needs this :p
	function HighLightMenuItem() {
	var menu = $find("ctl00_RadMenuTop"); // Can't use <%=RadMenuTop.ClientID%> as this is not allowed in SharePoint masterpage
	if(menu != null) {
	var menuItemFocused = menu.get_focusedItem(); // to get the default page that is always focused in my case;
	if(menuItemFocused != null) {
	menuItemFocused.blur();
	}
	var menuItemSelected = menu.findItemByAbosluteUrl(window.location.href);
	if(menuItemSelected != null) {
	menuItemSeleted.set_focused();
	}
	}
	}

This code doesn't work, so I tried to debug with the old good method and kept just this part :

	_spOnLoadBodyFunctionsNames.push("HighlightMenuItem");
	function HighLightMenuItem() {
	var menu = $find("ctl00_RadMenuTop");
	if(menu != null) {
	alert("Menu found");
	}
	}

And this doesn't work either ! If I replace the $find with a $get the latter code works but not the first one (obviously because $get doesn't return a component). As you can see I'm a bit stuck... :D

Does anyone has a Idea about why the $find method doesn't work in that case ?

Thank for any help !
Edgar

[Atanas Korchev]

Hi STEMax,

body.onload fires before Ajax controls are initialized - hence $find returns null. Please check this blog post for additional info.

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[STEMax]

Hi Albert,

It seemed so easy... It works, thank you !

But know i'm struggeling with get_focusedItem :), it seems that if the RadMenu don't know what item to highlight, it chooses the first one (am I right ?). But when I tried to get the item that is highlighted using :

var menuItemFocused = menu.get_focusedItem();

It returns null or undefined... Also, if I try to change the focused status of an Item to get it highlighted by using

var menuItemSelected = menu.findItemByAbsoluteUrl(windows.location.href); // this line works
menuItemSelected.set_focused();

It doesn't work either... It seems that CSS class "rmFocused" and Javascript status "focused" are not related. So I managed to change the code a bit and this lead my to :

var mIS = menu.findItemByAbsoluteUrl(windows.location.href);
if(mIS != null && mIS != undefined && mIS != "undefined")
{
   firstItem = menu.get_items().getItem(0);
   if(firstItem != mIS)
   {
      firstItem.get_linkElement().ClassName.replace(' rmFocused',''); // doesn't work
      mIS.get_linkElement().ClassName += " rmFocused";
   }
}

Yeah ! almost, done ! But the line to get the first item "unfocused" doesn't work (Ok I know may be i'm a fool thinking I can't just use a replace function but afterall this seems to be just a string, isn't it ?

Best regards
Edgar

[Atanas Korchev]

Hi STEMax,

To modify the css class of the link element you can use the className JavaScript property:

item.get_linkElement().className += " rmFocused";

I hope this helps,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[STEMax]

Hi Albert,

You're a naughty boy ! :P

You didn't read my code example, I already know how to add the "rmFocused" css class to the RadMenuItem, but I can't archieve to remove it from a already highlighted item... as "replace" function doesn't seems to work.

Best regards,
Edgar

[Atanas Korchev]

Hello STEMax,

The casing in your code is wrong - ClassName should read "className" (lowercase "c").

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[STEMax]

Hi,

Well this is a mistake when I have rewritten the code here, I can't do a copy/paste as I use a VM on Hyper-V and copy/paste from virtualized OS to host is not available... (yes, it's a pity !)
In my code the className is spelled correctly. So complete (and almost functionnal) code is :

Sys.Application.add_load(changeFocusedNode);
function changeFocusedNode() {
   var RadMenuTop = $find("ctl00_RadMenuTop");
   if(RadMenuTop != null && RadMenuTop != undefined && RadMenuTop != "undefined")
   {
      var mIS = menu.findItemByAbsoluteUrl(windows.location.href);
      if(mIS != null && mIS != undefined && mIS != "undefined")
      {
         firstItem = menu.get_items().getItem(0);
         if(firstItem != mIS)
         {
            firstItem.get_linkElement().className.replace(' rmFocused',''); // doesn't work
            mIS.get_linkElement().className += " rmFocused";
         }
      }
   }
}

Everything work great except the line with the comment "doesn't work".

I'm trying to get the first item to be not highlighted.

Best regards,
Edgar Maucourant

[Atanas Korchev]

Hello STEMax,

You can try this:

firstItem.get_linkElement().className = firstItem.get_linkElement().className.replace(' rmFocused','')

All the best,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[STEMax]

Hi,

OMG !!!! I didn't try yet but i can't believe I made such a mistake !!!  -<8|

Best regards,
Edgar Maucourant

[STEMax]

Hi Albert,

That works...

/me : feel so stupid I wish i could hide in a mouse hole !!!

Anyway, thank you so much for your help !

Best regards,
Edgar Maucourant