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.

Bind data with JS

Thread ID:

Created:

Updated:

Platform:

Replies:

132361 Aug 28,2017 12:59 PM Aug 30,2017 12:25 AM JavaScript 3
loading
Tags: ejGrid
noName
Asked On August 28, 2017 12:59 PM

I am following instructions from here: https://help.syncfusion.com/js/grid/data-binding
I am trying to create Grid with JS and bind data to it, but I see grid with this: No records to display 
, but there are records, If I load the URL in the browser, I see the results.
This is my HTML:
<div id="Grid"></div>
and my JS:
var dm = ej.DataManager({
    url: "/users/get"

});
    $("#Grid").ejGrid({
        dataSource: dm,
        columns: [
            { field: "id", headerText: "ID", isPrimarykey: true, textAlign: ej.TextAlign.Right},
            { field: "email", headerText: "Email"},
            { field: "name", headerText: " Name"},

        ]

    });
It is same if I use custom adapter or WEBAPI adapter.
This is the action:
public IActionResult Get() { return Json(users.All()); }
and if I access it via browser it returns results, like this:

[{ "id": 1, "email": "email@email.com",
"Name": "Your Name" }];
It works fine, If I access data from url copy and set it to the variable like this:
.....
var results = [{
    "id": 1,
    "email": "email@email.com",
"Name": "Ivan",
}];
    $("#Grid").ejGrid({
        dataSource: results,
......
, but if I do this:

var dm = ej.DataManager({
    url: "/users/get"

});
    $("#Grid").ejGrid({
        dataSource: dm,

it doesn't work. The grid is loaded with text No records to display.


Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On August 29, 2017 02:30 AM

Hi Customer,  
 
We could see you would like to bind Grid data from the controller action. By default, Grid provides an option to bind the data from the controller action. UrlAdaptor of the DataManager helpful to bind the data from the controller. Refer to the following Help Document.  
 
 
To perform various data operations like filtering, sorting and paging at the server end, DataManager provides DataOperations class from the Syncfusion.EJ libraries. Refer to the following KB for various supporting Data Operaions.  
 
 
Refer to the following code example.  
 
        public ActionResult DataSource(DataManager dm) 
        { 
            IEnumerable Data = OrderRepository.GetAllRecords().ToList(); 
            DataOperations operation = new DataOperations(); 
            int count = Data.AsQueryable().Count(); 
            if (dm.Skip != 0) //Paging 
            { 
                Data = operation.PerformSkip(Data, dm.Skip); 
            } 
            if (dm.Take != 0) //Paging 
            { 
                Data = operation.PerformTake(Data, dm.Take); 
            } 
            return Json(new { result = Data, count = count }, JsonRequestBehavior.AllowGet); 
        } 
 
<div id="Grid"></div> 
 
<script type="text/javascript"> 
 
    $(function () { 
        var dm = ej.DataManager({ 
            url: "/Home/DataSource", 
            adaptor: new ej.UrlAdaptor() 
        }); 
 
        $("#Grid").ejGrid({ 
            dataSource: dm, 
            allowPaging: true, 
                . .  
                       . .  
        }); 
    }); 
</script> 
 
Please make a note that the resultant object of the handler must be wrapped with the result/count pair.  
 
We have prepared a sample that can be downloaded from the following location.  
 
 
Regards,  
Seeni Sakthi Kumar S. 
 


noName
Replied On August 29, 2017 03:39 PM

Thanks, it works.


Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On August 30, 2017 12:25 AM

Hi Customer,  
 
Thanks for the update.  
 
We are happy to hear that your requirement has been achieved and you are good to go. Please get back to us, if your require further assistance on this.  
 
Regards,  
Seeni Sakthi Kumar S. 
 
 


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.

;