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

How to get the PrimaryKey from command button click event in Grid

Hi

I have a command button to trigger click event in data-bound Grid.
But I can't find any documentation on your site that show me how to retrieve the primary key of the row the button being clicked.
Can you advice? thanks. 

        @(Html.EJ().Grid<PageBanner>("Binding")
            .Datasource((IEnumerable<object>)ViewBag.datasource)
            .AllowSelection(false)
            .Columns(col =>
            {
                col.Field("i_banner_id").HeaderText("ID").IsPrimaryKey(true).Visible(false).Add();
                col.Field("u_title").HeaderText("Title").Width(80).Add();
                col.HeaderText("Edit").Commands(command =>
                {
                    command.Type("Edit")
                           .ButtonOptions(new Syncfusion.JavaScript.Models.ButtonProperties()
                           {
                               Text = "Edit",
                               Width = "50px",
                               Click = "onEditClick"
                           }).Add();
                })
               .IsUnbound(true)
               .Add();
            })

<script type="text/javascript">

    function onEditClick(args) {
        for (var key in args) {
            alert(args[key]);
        }
    }

</script>

7 Replies

GV Gowthami V Syncfusion Team April 2, 2015 10:40 AM UTC

Hi Jimmy,
Thanks for using Syncfusion products.
We can achieve your requirement by passing the rowElement index to the getCurrentViewData method for getting the clicked record. With that record we can get the primary key value of the particular row in the Click event of the Command button as follows.
@(Html.EJ().Grid("Binding")
.Datasource((IEnumerable)ViewBag.datasource)
. . . .

.Columns(col =>
{

col.HeaderText("Edit").Commands(command =>
{

.ButtonOptions(new Syncfusion.JavaScript.Models.ButtonProperties()


{

Click = "onEditClick"


}).Add();


})
)

<script type="text/javascript">

function onEditClick(args)

{

var grid = $("# Binding ").ejGrid("instance");

var index = this.element.closest("tr").index(); //For getting clicked rowElement(tr) index

var record = grid.getCurrentViewData()[index]; //For getting the record by passing the row index

var primaryKeyValue=record[i_banner_id]; //Here i_banner_id is primarykey column.

}
</script>

Please try the above snippet and let us know if you have any queries.
Regards,
Gowthami V.



JS Jimmy Soh April 3, 2015 08:28 AM UTC

Hi Thanks for the example. Will try it out.


GV Gowthami V Syncfusion Team April 6, 2015 02:36 PM UTC

Hi Jimmy,

Thanks for your update,

Please get back to us if you need any further assistance. We will happy to assist you.

Regards,
Gowthami V.



EK Edwin Kurniawan October 28, 2016 04:01 AM UTC

Hi Gowthami,

this line will always return index 0 regardless real index row if grid is grouped
    var
index = this.element.closest("tr").index(); //For getting clicked rowElement(tr) index

Do you have any workaround? Is there is no keyFieldId in args?


SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team October 28, 2016 07:25 AM UTC

Hi Edwin, 

We are able to reproduce the problem at our end. To overcome this problem, use the getIndexByRow method of the Grid which will filter out only the record rows and returns the exact index of the tr. Refer to the following code example and API reference section of the . 

    <script> 
        function onEditClick(args) { 
            var grid = $("# Binding ").ejGrid("instance"); 
            //getIndexByRow method 
            var index = grid.getIndexByRow(this.element.closest("tr")); //For getting clicked rowElement(tr) index 
            var record = grid.getCurrentViewData()[index];  
            var primaryKeyValue = record[i_banner_id]; 
        } 
    </script> 


Regards, 
Seeni Sakthi Kumar S. 



EK Edwin Kurniawan October 28, 2016 07:47 AM UTC

Hi Seeni Sakthi,

The new code snippet is working nicely.
Thank you for your solution, GBU.


Best regards,


Edwin.


FS Farveen Sulthana Thameeztheen Basha Syncfusion Team October 31, 2016 04:55 PM UTC

Hi Edwin, 
  
We are happy to hear that the provided solution has been working fine at your end. 
  
Regards, 

Farveen.T 
  
  


Loader.
Live Chat Icon For mobile
Up arrow icon