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. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

TreeGrid custom menu

Thread ID:

Created:

Updated:

Platform:

Replies:

118289 Feb 20,2015 01:00 PM UTC Jul 27,2015 11:41 AM UTC ASP.NET MVC 3
loading
Tags: TreeGrid
Neil Partington
Asked On February 20, 2015 01:00 PM UTC

Hi,

I have a few issues with context menu's on the TreeGrid. My TreeGrid is embedded in part of a "Splitter" control and the relevant code can be seen below.

1. Is there a way of removing ALL standard context menu items? (I only want the custom items to display).
2. The code below displays the custom menu items, but the "click event" functions are never called, am I missing something? (The number of custom menu items doesn't make a difference).
3. On a different subject - Is there a way of having a single header which spans across multiple (data) columns?

Thanks

                    @Html.EJ().TreeGrid("treeGrid").ChildMapping("Children").TreeColumnIndex(1).SizeSettings(sz => sz.Height("900")).Columns(co =>
                       {
                           co.Field("Name").headerText("Name").Add();
                           co.Field("Name").headerText("Some Text").Add();
                       }).Datasource(ViewData["gridItems"]).EnableCollapseAll(true).ContextMenuSettings(cms => cms.ShowContextMenu(true).ContextMenuItems(new List<TreeGridContextMenuItems>() { TreeGridContextMenuItems.Delete } )).ContextMenuOpen("customMenu")

<script type="text/javascript">
    function customMenu(args) {
     args.contextMenuItems.push(
         {
             headerText: "Menu 1", iconPath: "url(…/images/custommenu.png)", eventHandler: customMenuClick1
         }
         );
     args.contextMenuItems.push(
         {
             headerText: "Menu 2", iconPath: "url(…/images/custommenu.png)", eventHandler: customMenuClick2
         }
         );
 }
    function customMenuClick1(args) {
        alert("Menu 1 Clicked");
    }
    function customMenuClick2(args) {
        alert("Menu 2 Clicked");
    }
</script>

John Rajaram [Syncfusion]
Replied On February 23, 2015 11:37 AM UTC

Hi Neil,

Thank you for using Syncfusion Products.

Query

Syncfusion Comments

Is there a way of removing ALL standard context menu items? (I only want the custom items to display).

Yes, we can remove the standard context menu items from the Gantt control with the help of “ContextMenuOpen” client side event. Please refer the below code snippets for removing the standard context menu items.

Code snippets:

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

//...

.ContextMenuOpen("customMenu")

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

       )

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

   <script>

       function customMenu(args) {

           args.contextMenuItems.splice(0, 2); // To remove standard context menu items

       //...

       }

   </script>

The code below displays the custom menu items, but the "click event" functions are never called, am I missing something? (The number of custom menu items doesn't make a difference).

Please find the below code snippet for rendering only the custom context menu items in the context menu and for triggering events for the custom menu items,

Code snippets:

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

//...

.ContextMenuOpen("customMenu")

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

       )

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

   <script>

       function customMenu(args) {

           args.contextMenuItems.splice(0, 2); // To remove standard context menu items

           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>

Now we have prepared a sample based on this and you can find the sample under the following location.

Sample: http://www.syncfusion.com/downloads/support/directtrac/118289/TreeGridMVC_CustomContextMenu-1546701158.zip

But currently we are facing some issues with triggering events for custom context menu items if its ‘headerText’ contains multiple words . Thus event triggers if the value is like “Menu_1” but event is not triggered for values like “Menu 1”

So we have logged an issue report “Issue in headerText property of custom context menu items” and we have confirmed this as bug and logged a report on this. Also we have created a support incident under your account to track the status of this issue.

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

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

On a different subject - Is there a way of having a single header which spans across multiple (data) columns?

At present there is no support for single header which spans across multiple columns. So we considered this requirement “Support for Stacked header in TreeGrid control” as feature and a support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

Please let us know if you need more information on this.

Regards,

John R



krishna
Replied On July 23, 2015 01:46 PM UTC

Hi John

it works fine......... :)
but I want to add the row with above and below options in context-menu but event handler for sub-menu items (above and below) is NULL
so to resolve that issue I have created custom context menu items with event handler functionality but it will not work for sub-menu items (like for above and below) mns on first level it works fine but for 2nd level doesn't work, why???????????????????????  

Mahalakshmi Karthikeyan [Syncfusion]
Replied On July 27, 2015 11:41 AM UTC

Hi Krishna,

Sorry about the inconvenience caused.

Currently there is no support for event handlers to sub-context menu item in TreeGrid control. We have already logged feature report regarding this. A support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

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

Regards,

Mahalakshmi K.


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;