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.
Syncfusion Feedback

DataManager/ejGrid without specifying resource path in DataManager

Thread ID:

Created:

Updated:

Platform:

Replies:

117236 Sep 12,2014 09:47 AM UTC Jan 20,2016 09:14 AM UTC JavaScript 6
loading
Tags: ejDataManager
Sebastian Schocke
Asked On September 12, 2014 09:47 AM UTC

I have been trying to use a global DataManager instance to link to an OData service, and then have each of the grids specify the resource path component, instead of creating a DataManager instance for each grid with the resource path already given. Is this possible?

I have seen this example given:

var dm = ej.DataManager("http://mvc.syncfusion.com/Services/Northwnd.svc/");
var query = ej.Query()
.from("Orders")
.select("OrderID","CustomerID","OrderDate","Employee.FirstName")
.page(1, 10)
.expand("Employee");
var promise = dm.executeQuery(query);
promise.done(function (e) {
    $('#Grid').ejGrid({dataSource: e.result});
}

But how does this bind to the remote source? If I now have a user that performs a search on this grid, I will have to create a new Query again, instead of using the built in functionality of the Grid, correct?

I was hoping something like this is possible, where the Grid still builds the OData URI.

var dm = ej.DataManager("http://mvc.syncfusion.com/Services/Northwnd.svc/");
$('#Grid').ejGrid({dataSource: dm, from:"Orders"});

If this is not possible, it's not an issue. It would just seem a cleaner approach to me.


Gowthami V [Syncfusion]
Replied On September 15, 2014 09:18 AM UTC

Hi Sebastian

We have analyzed the query that you have mentioned in the previous post. We have created a sample based on your requirement and the same can be downloaded from the following link:

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/CRUD1493267197.zip

In the above sample we have rendered two grids with separate data source, One grid with “Orders” table and the other grid with “Customers” table by passing the separate query for each grid using “query” property of the grid.

Please refer the below code snippet:


<script type="text/javascript">

 $(function () {

            var dataManger = ej.DataManager({

                url: "http://mvc.syncfusion.com/Services/Northwnd.svc/"

            });

                var queryOrders = ej.Query().from("Orders").select("OrderID", "CustomerID", "OrderDate", "Employee.FirstName").expand("Employee");

                var queryCustomer = ej.Query().from("Customers").select("CustomerID", "CompanyName", "ContactName");

          

                $("#GridOrders").ejGrid({

              

                dataSource: dataManger,

                query: queryOrders

});

  $("#GridCustomer").ejGrid({

 

                dataSource: dataManger,

                query: queryCustomer

  });

        });

    </script>

Please try the above sample and please get back to us if we misunderstood your requirement.

Regards,

Gowthami V.

 


Sebastian Schocke
Replied On September 15, 2014 03:27 PM UTC

Thank you very much for the prompt response. The query parameter to ejGrid is exactly what I was looking for.

Sebastian Schocke
Replied On September 15, 2014 03:31 PM UTC

BTW, I just went to double check if I missed it, but it is not a documented option for ejGrid in the JavaScript class reference. Maybe it should be added? It is a very useful option

Gowthami V [Syncfusion]
Replied On September 16, 2014 11:27 AM UTC

Hi Sabastian

Thanks for your update.

As you suggested in the previous response we will add the “query” option of the ejGrid to javascript class reference document.

Please get back to us if you have any queries we will happy to assist you.

Regards,

Gowthami V.

 


Luiz Frederico Jr
Replied On January 19, 2016 10:51 PM UTC

Hi Sebastian

We have analyzed the query that you have mentioned in the previous post. We have created a sample based on your requirement and the same can be downloaded from the following link:

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/CRUD1493267197.zip

In the above sample we have rendered two grids with separate data source, One grid with “Orders” table and the other grid with “Customers” table by passing the separate query for each grid using “query” property of the grid.

Please refer the below code snippet:


<script type="text/javascript">

 $(function () {

            var dataManger = ej.DataManager({

                url: "http://mvc.syncfusion.com/Services/Northwnd.svc/"

            });

                var queryOrders = ej.Query().from("Orders").select("OrderID", "CustomerID", "OrderDate", "Employee.FirstName").expand("Employee");

                var queryCustomer = ej.Query().from("Customers").select("CustomerID", "CompanyName", "ContactName");

          

                $("#GridOrders").ejGrid({

              

                dataSource: dataManger,

                query: queryOrders

});

  $("#GridCustomer").ejGrid({

 

                dataSource: dataManger,

                query: queryCustomer

  });

        });

    </script>

Please try the above sample and please get back to us if we misunderstood your requirement.

Regards,

Gowthami V.

 


I am testing your sample Grid Master-Detail in MVC and when select an row in Grid<EmployeeView>("MasterGrid") this trigger the javascript ej.DataManager who use window.gridData...
How could i use the ViewBag.datasource2 to make this sample real live ???

Refrasing, i need replace the window.gridData on javascript by the ViewBag.datasource ok?

<script src="~/Scripts/jsondata.min.js"></script>
<script type="text/javascript">
    $(function () {
        window.rowSelected = function (args) {
            var juserID = args.data.UserId;
            var detaildata = ej.DataManager(window.gridData).executeLocal(ej.Query().where("UserId", ej.FilterOperators.equal, juserID, false).take(100));
            var gridObj = $("#DetailGrid").ejGrid("instance");
            gridObj.dataSource(ej.DataManager(detaildata.slice(0, 5)));
        }
    });
</script>

Gowthami V [Syncfusion]
Replied On January 20, 2016 09:14 AM UTC

Hi Luiz,
We can access the variable defined in the controller in client side using @Html.Raw” as follows,

@(Html.EJ().Grid<object>("DetailGrid")

        .Datasource((IEnumerable<object>)ViewBag.datasource2)

. . . .

)


<script type="text/javascript">

     $(function () {

      

            window.rowSelected = function (args) {

//Access the variable from the controller

                var data =  @Html.Raw(Json.Encode(ViewBag.dataSource2));

                var employeeID = args.data.EmployeeID;

                var detaildata = ej.DataManager(data).executeLocal(ej.Query().where("EmployeeID", ej.FilterOperators.equal, employeeID, false).take(10));

                var gridObj = $("#DetailGrid").ejGrid("instance");

                gridObj.dataSource(ej.DataManager(detaildata.slice(0, 5)));

            }

        });

    </script>
   


Refer to the below screenshot,



For your reference we have attached the sample below,

http://www.syncfusion.com/downloads/support/directtrac/general/MVCAPP~2-2048912920.ZIP

Regards,

Gowthami V.

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.

Warning Icon 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.Close Icon

;