We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Context Menu custom click - args

I have a custom menu on the TreeGrid control, setup as per your examples seen below.

The function that handles the menu click has "args" as a parameter. Can you tell me what type of object this is and how i can extract the selected rows information from it?

Do you have any reference documents at all for your controls, since your documentation is very basic?

.

<script type=”text/javascript”>

  function customMenu( args )

{

   args.contextMenuItems.push(

   {

      headerText: "customMenu",

   iconPath: “url(…/images/custommenu.png)”,

   eventHandler: customMenuClick,

   }

   );

}

  function customMenuClick( args )

  {

  }

</script>


1 Reply

JR John Rajaram Syncfusion Team March 2, 2015 10:53 AM UTC

Hi Neil,

Thanks for using Syncfusion products.

Query 1:

Can you tell me what type of object this is and how i can extract the selected rows information from it?

Solution:

We would like to let you know that, “args” parameter, which is passed to the “ContextMenuOpen” client side event is a JSON object. It holds the details of the selected rows, list of context menu items and their corresponding sub context menu items. Please check the following details for the list of items available in the “args” parameter.

ARGS

Action

contextMenuItems

List of context menu items

index

Index of the selected row

innerContextMenuItems

List of sub context menu items corresponding to the main context menu items.

item

Details of the selected rows

model

TreeGrid object

targetElement

Html elements of the clicked row

Please find the below code snippets for rendering custom context menu in TreeGrid.

Code snippets:

<body style="position: static; margin: 0px; padding: 2px">

    @(Html.EJ().TreeGrid("Tree")

    //...

    .ContextMenuSettings(cms => cms.ShowContextMenu(true)

        .ContextMenuItems(new List<TreeGridContextMenuItems>()

        {

          TreeGridContextMenuItems.Add,

          TreeGridContextMenuItems.Edit,

          TreeGridContextMenuItems.Delete

        }))

       .ContextMenuOpen("customMenu")

       .Datasource((System.Collections.IEnumerable)ViewBag.datasource)

       )

    @(Html.EJ().ScriptManager())

    <script>

       function customMenu(args) {

           args.contextMenuItems.push({

               headerText: "Menu_1",

               iconPath: 'url("../../Images/setIcon.png")',

               eventHandler: customMenuClick1,

           })

           args.contextMenuItems.push({

               headerText: "Menu_2",

               iconPath: 'url("../../Images/setIcon.png")',

               eventHandler: customMenuClick2,

           })

       }

       function customMenuClick1(args) {

           alert("Custom Menu 1 clicked");

       }

       function customMenuClick2(args) {

           alert("Custom Menu 2 clicked");

       }

   </script>

</body>

We have also prepared a sample based on this for rendering the context menu. Please find the sample in the following location.

Sample: http://www.syncfusion.com/downloads/support/directtrac/118346/TreeGridMVC_simple_custom__context_menu1065681504.zip

Query 2:

Do you have any reference documents at all for your controls, since your documentation is very basic?

Solution:

We request you to refer the below online link for the reference documents related to the properties of all Syncfusion controls.

Online Link: http://help.syncfusion.com/cr/js

For TreeGrid control, we have logged a documentation improvement task for this. Also we have created a support incident under your account to track the status of the documentation task and documentation information from all other Syncfusion controls.

Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents

Please let us know if you require further assistance on this.

Regards,
John. R



Loader.
Up arrow icon