Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1495
dynamically adding menu items & javascript
posted

Is there a way to dynamically add menu items and get it to run a javascript funciton instead of navigate url?

Parents
No Data
Reply
  • 4493
    Suggested Answer
    posted

    Hi,

    You can add items only through code behind on Page_Load or later event handler. You shall be able to set any valid JavaScript expression for NavigateUrl, and it shall be executed when user clicks on it.
    For example:

        1 <ig:DataMenuItem

        2                     Key="expand"

        3                     Text="Expand/Collapse"

        4                     NavigateUrl="BLOCKED SCRIPTalert('Hello')">

        5                 </ig:DataMenuItem>

    You can also have a predefined number of menu items (for example from the MarkUp) like the one above. And you can have your own custom JavaScript code that can change DataMenuItem properties for each item, based on item's key. You can change Text, NavigateUrl. Here is example of such a function:

        1 function setupMenu(menu) {

        2             var item = menu.getItems().getItem(0);

        3             while (item != null) {

        4                 setUpText(menu, item);

        5                 item = item.get_nextItem();

        6             }

        7         }

     

    And the Function that will change texts/navigate Url:

        1 function setUpText(menu, item) {

        2     var key = item.get_key();

        3     switch (key) {

        4         case "edit":

        5               item.set_text("Your new Text for 'edit' key !");

        6               if(item.get_anchorElement() != null)

        7                 item.get_anchorElement().href = "BLOCKED SCRIPTalert('hello')";

        8             break;

        9     }

       10     var child = item.get_childItem(0);

       11     while (child != null) {

       12         setUpText(menu, child, node);

       13         child = child.get_nextItem();

       14     }

       15 }

     

    The check for get_anchorElement() is required, only if you are sure that no templates are used within the menu. In case you are using templates, you can use item.get_element() method as direct reference to DOM Element of the item and manipulate it as you wish.

     

    The only thing is, that you can't ADD/REMOVE items on the client. But you still can do it on the Code Behind.

Children
No Data