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

Ejgrid DataManager object


Im trying to use Js Grid like in this example.

Client Side:

var dataManger = ej.DataManager({
               url: "@(Url.Action("GetList","Survey"))" + "/" + $("#SurveySelector").val()
              locale: "pt-PT",
              dataSource: dataManger,
              allowPaging: true,
              allowSorting: true,
              allowGrouping: true,
              enableDropAreaAnimation: false,
              allowFiltering: true,
              filterSettings: { showFilterBarStatus: true },
              columns: [
                      { field: "EntityValue", headerText: "Entidade", width: 70 },
                      { field: "EntityCreated", headerText: "Criada a", format: "{0:dd/MM/yyyy HH:mm:ss}", width: 65 },
                      { field: "StatusValue", headerText: "Estado", width: 40 },
                      { field: "AnsweredByDescription", headerText: "Respondido por", width: 60 },
                      { field: "Phone1", headerText: "Telefone 1", width: 40 },
                      { field: "Phone2", headerText: "Telefone 2", width: 40 },
                      { field: "MobilePhone", headerText: "Telemóvel", width: 40 },
                      { field: "Email", headerText: "Email", width: 90 },
                      { field: "", headerText: "Respostas", template: "#templateRespostas", width: 40, textAlign: ej.TextAlign.Center },
                      { field: "", headerText: "Operações", template: "#templateOperacoes", width: 40, textAlign: ej.TextAlign.Center }
Server Side:

public ActionResult GetList()
    string surveyId = Request.Url.Segments[4].Remove(Request.Url.Segments[4].Length - 1);
    int topParam = int.Parse(Request.QueryString["$top"]);
    int skipParam = int.Parse(Request.QueryString["$skip"]);
    string filterParam = Request.QueryString["$filter"];
    string orderByParam = Request.QueryString["$orderBy"];

Dm property always gets empty. Any help? Im not using any MVC tool from syncfusion, only JS grid. The only thing i add to test the datamanager on server side was the include of Syncfusion.EJ.dll on my project.

4 Replies

JK Jayaprakash Kamaraj Syncfusion Team April 19, 2016 07:21 AM UTC

Hi Joaquim,

Thanks for contacting Syncfusion support.

We have analyzed your code example and found that you have missed setting adaptor as 
UrlAdaptor in the ejDataManager. So, please set adaptor as the UrlAdaptor. In this adaptor, you have to pass the parameter as DataManager, and also have to refer Syncfusion.Ej dll in your project to use DataManager. Please refer to the following code example, help document and sample.



    $(function () {

        var dataManager = ej.DataManager({ url: "/Home/DataSource", adaptor: new ej.UrlAdaptor() });


            locale: "pt-PT",

            dataSource: dataManager,

            allowPaging: true,

            allowSorting: true,

            allowGrouping: true,

            enableDropAreaAnimation: false,

            allowFiltering: true,

            filterSettings: { showFilterBarStatus: true },

            columns: [

            { field: "OrderID", headerText:"OrderID",width: 120 },

            { field: "OrderDate", headerText: "Archived", format: "{0:yyyy/MM/dd HH:mm:ss}", width: 140 },

            { field: "CustomerID",headerText:"CustomerID",width: 100 }]




public ActionResult DataSource(DataManager dm)


            IEnumerable DataSource = new NorthwindDataContext().OrdersViews.ToList();

            DataOperations operation = new DataOperations();

            DataResult result = new DataResult();

            result.result = DataSource;

            result.count = result.result.AsQueryable().Count();

            if (dm.Skip > 0)

                result.result = operation.PerformSkip(result.result, dm.Skip);

            if (dm.Take > 0)

                result.result = operation.PerformTake(result.result, dm.Take);

            return Json(result, JsonRequestBehavior.AllowGet);


        public class DataResult


            public IEnumerable result { get; set; }

            public int count { get; set; }

Help document: http://help.syncfusion.com/js/grid/editing#persisting-data-in-server

Sample: http://www.syncfusion.com/downloads/support/forum/123753/ze/ejGrid_Filtering-1680098298


Jayaprakash K.

JS Joaquim Santos April 19, 2016 10:03 AM UTC

Thanks worked all fine.

JS Joaquim Santos April 19, 2016 10:07 AM UTC

Taking this opportunity to make additional question. Is there any feature or way to make ejgrid look better in mobile or different size browsers, phones? As width gets shorter all information becomes clumsy. Is there any card feature or any to display information in another format? Thanks once again!

JK Jayaprakash Kamaraj Syncfusion Team April 20, 2016 11:10 AM UTC

Hi Joaquim,

In Grid, we have default support for responsive behavior. If responsive is enabled, then the grid will be rendered based on parent’s width and height. We need to set isResponsive and min-width Property to enable responsive in Grid. Min Width is used to maintain minimum width for the Grid and if the grid width is less than minWidth then the scrollbar will be displayed. Please refer to the below code example, help documentation, online demo link and sample.

    <script type="text/javascript">

        $(function () {

            // the datasource "window.gridData" is referred from jsondata.min.js

            var data = ej.DataManager(window.gridData).executeLocal(ej.Query().take(50));


                dataSource: data,

                           isResponsive: true,

                           minWidth: 700,

                allowPaging: true,

                allowSorting: true,

                columns: [

                        { field: "OrderID", headerText: "Order ID", width: 75 , textAlign: ej.TextAlign.Right },

                        { field: "CustomerID", headerText: "Customer ID", width: 80 },

                        { field: "EmployeeID", headerText: "Employee ID", width: 75, textAlign: ej.TextAlign.Right },

                        { field: "Freight", width: 75, format: "{0:C}", textAlign: ej.TextAlign.Right },

                        { field: "OrderDate", headerText: "Order Date", width: 80, format: "{0:MM/dd/yyyy}", textAlign: ej.TextAlign.Right },

                        { field: "ShipCity", headerText: "Ship City", width: 110 }




Help Documentation for IsResponsive: http://help.syncfusion.com/js/api/ejgrid#members:isresponsive

Help Documentation for MinWidth: http://help.syncfusion.com/js/api/ejgrid#members:minwidth

Online Demo link: http://js.syncfusion.com/demos/web/#!/azure/grid/adaptive

Sample: http://www.syncfusion.com/downloads/support/forum/123753/ze/Responsive1367555081


Jayaprakash K.

Live Chat Icon For mobile
Up arrow icon