Send selected row data to controller

[JoAnn Donaldson]

I can create a button that when clicked will display a message. Now I want to click the button and send selected row records to the controller for further processing.

[Keerthikaran Venkatachalam]

Hi JoAnn Donaldson,

We have checked your reported query and prepared a sample based on your requirements. By using the getSelectedRecords method of the Grid, you can retrieve the selected row of grid data. Please refer to the code snippet and sample below.

[Index.cshtml]

<div>

    @Html.EJS().Grid("grid").DataSource((IEnumerable<object>)Model).Columns(col =>

{

   col.Field("OrderID").HeaderText("Order ID").Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();

   col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add();

   col.Field("OrderDate").HeaderText("Order Date").Width("130").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Format("yMd").Add();

   col.Field("ShipCountry").HeaderText("Ship Country").Width("120").Add();

 

}).AllowPaging(true).AllowSorting(true).AllowFiltering(true).AllowGrouping(true).PageSettings(page => page.PageSize(5)).Render()

</div>

@Html.EJS().Button("gridData").CssClass("e-primary").Content("Get Selected Grid Data").Render()

 

<script>

        document.getElementById('gridData').onclick = function () {

            var grid = ej.base.getComponent(document.getElementById("grid"), 'grid');

            var data = grid.getSelectedRecords();

            $.ajax({

                type: "POST",

                data: { content: JSON.stringify(data) },

                url: "/Home/getPredicate",

                success: function (content) {

                    console.log("success")

                }

            });

        }

</script>

[HomeController.cs]

public void getPredicate(string content)

 {

     Console.WriteLine(content); // you can get the data using API call

}

Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ASP.NET_MVC_Razor_Examples-1790129304.zip

Please let us know if you need any further assistance on this.

Regards,

KeerthiKaran K V

[JoAnn Donaldson]

I did an update for the MVC5 code to Version ....42.

Now the Ajax code works but now I get

"tsc.exe exited with code 1"

[JoAnn Donaldson]

Would it if I create a Dropbox folder where you can see my code and database?

[JoAnn Donaldson]

You have not solved my problem. Please respond. 

[Keerthikaran Venkatachalam]

Hi JoAnn Donaldson,

Please confirm the component you are using in the project sample. Also, please share the code snippets, replicable sample with steps, and a video demonstration of the issue. Based on this information, we will provide a quick and improved solution.

Regards,

KeerthiKaran K V

[JoAnn Donaldson]

I did what you suggested to do. 

1. I updated the the V23.1.36 to V23.1.42.
2. commented out the    

@* @Styles.Render("~/Content/ej2/fluent.css")

    @Scripts.Render("~/Scripts/ej2/ej2.min.js") *@

3. Added  

<link rel="stylesheet" rel='nofollow' href="https://cdn.syncfusion.com/ej2/23.1.42/material.css" />

    <script src="https://cdn.syncfusion.com/ej2/23.1.42/dist/ej2.min.js"> </script>

All looks good until I attempt to do a build and then I get "tsc.exe" exited with code 1.

[JoAnn Donaldson]

I download and ran the sample code. It seems to work, so I will use this as the base for my program. I will issue a new ticket if I have further problems.

JoAnn Donaldson

[Keerthikaran Venkatachalam]

We're glad your issue was resolved. Please get back to us in the future for further assistance.