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.
Unfortunately, activation email could not send to your email. Please try again.

Two Custom Command Buttons in a Grid

Thread ID:

Created:

Updated:

Platform:

Replies:

120681 Oct 2,2015 05:17 PM Oct 6,2015 05:36 AM JavaScript 3
loading
Tags: ejGrid
Lory
Asked On October 2, 2015 05:17 PM

Hi Team,

I have a grid that has two custom command buttons. I assigned a different function for each button. Ideally, if the user clicks the first button it would go to SearchItemNo function, if it's the second it will go to SeachUnit function. But if I click either of the button it will only route to SearchUnit function. Is there something I'm doing wrong?


$(function () {
  $('#ShipmentGrid').ejGrid({
     ...
    columns: [
           { field: "EmployeeID", headerText: "Employee ID", width: 150 },
           { 
                      headerText: "Search Item",
                      headerTemplateID: "#searchTemplate",  
                      width: 60,
                      allowEditing: false,                     
                      commands: [
                          {
                              
                              type: "details",
                              buttonOptions: {
                                  text: "...",
                                  width: "15",
                                  click: "SearchItemNo",
                              }
                          }
                      ],
                      isUnbound: true,
                      textAlign: ej.TextAlign.Center,
          },
         { field: "Unit", headerText: "Unit", width: 100, editType: ej.Grid.EditingType.Dropdown, dataSource: Units },
         {
                       headerText: "",
                       headerTemplateID: "#searchTemplate",
                       width: 60,
                       allowEditing: false,                       
                       commands: [
                           {
                               type: "details",
                               buttonOptions: {
                                   text: "...",
                                   width: "15",
                                   click: "SearchUnit",
                               }
                           }
                       ],
                       isUnbound: true,
                       textAlign: ej.TextAlign.Center,
         },
   });
});

function SearchItemNo(args) {
    var grid = $("#Grid").ejGrid("instance");
    var index = this.element.closest("tr").index();
    $("#dialogItemSearch").ejDialog("open");
}

function SearchUnit(args) {
    var grid = $("#Grid").ejGrid("instance");
    var index = this.element.closest("tr").index();
    var record = grid.getCurrentViewData()[index];
}


I also tried to make a way around it by using a template for the second custom command, like so
     { field: "SearchUnit", headerText: "", width: 60, allowEditing: false, headerTemplateID: "#searchTemplate", templateID: "#searchUnitTemplate" },
but the output was rather unappealing and nothing like the way the custom command button was rendered in the grid.


Thanks.


Isuriya Rajan [Syncfusion]
Replied On October 5, 2015 06:16 AM

Hi Lory,
Thanks for contacting Syncfusion support.
We are unable to reproduce the issue in our side. Can you please revert us by modifying the sample based on your application along with the replication procedure? This would be helpful for us to serve you.
Please share the following details to find the cause of the issue,  

        1.          Which type of editingmode you have enabled for your grid?

2.           Share the Essential Studio version


We have created a sample using custom command buttons in jsPlayground,

Sample: Sample

Regards,
Isuriya R


Lory
Replied On October 5, 2015 09:53 AM

I'm using only batch edit mode, version : 13.2.0.29 of  MVC Syncfusion. I found out the reason why it's not functioning properly. It should be noted that the header text for the custom command buttons cannot have the same value.

Isuriya Rajan [Syncfusion]
Replied On October 6, 2015 05:36 AM

Hi  Lory,
We considered the requirement “Custom command with same header text click event trigger the same event” as a bug. We have logged a report on this and will fix the issue internally, also the fix will be included in Volume 3, 2015 Service Pack 1 ,which has been scheduled to be rolled out in the end of October, 2015.
We have also created an incident internally to have a follow up with this issue.
Regards,
Isuriya R

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.

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.

;