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.

Master Details Grid and Complex binding

Thread ID:

Created:

Updated:

Platform:

Replies:

125929 Sep 12,2016 10:28 AM Sep 15,2016 03:02 AM JavaScript 3
loading
Tags: ejGrid
Andrea Perazzolo
Asked On September 12, 2016 10:28 AM

HI,
Following your example on Master Details grid, I have changed a little to use the Datamanager with ODataV4Adaptor.
I have modified the RowSelected Event trying to change the model Query of the grid with the filter value
as in this code.

rowSelected: function (args) {
    var idEtichetta = args.data.IdEtichetta;
    idEtichettaSelected = idEtichetta;
    var gridObj = $("#GridDetail").data("ejGrid");
    gridObj.model.query = ej.Query().where("IdEtichetta", "equal", idEtichetta);
    gridObj.refreshContent();
},

It works fine, but if i try to use a complex binding (e.g a field on a navigation property of the Datasource of the details grid), the refreshed grid loses the Expand call on the Datamanager and it does not fill the data of the Navigation field columns.
So I have changed the code like this (is on another page)

rowSelected: function (args) {
    var idEtichetta = args.data.IdEtichetta;
    idEtichettaSelected = idEtichetta;
    var gridObj = $("#GridProdotti").data("ejGrid");
    var newDm = ej.DataManager({
        url: "@(AppSettings.Value.BaseDataUrl)/odata/EtichetteXProdotto",
        adaptor: new ej.ODataV4Adaptor()
    });
    var query = ej.Query().expand("Prodotto").where("IdEtichetta", "equal", idEtichetta);
    newDm.executeQuery(query)
            .done(function (e) {
                gridObj.dataSource(ej.DataManager(e.result));
                gridObj.refreshContent();
            });
},
and this works fine filling the data correctly.
The problem is when I have an editable Details grid, that with this workaround I will lose the functionality of sending the data on the Server, changing the Datasource on the fly with a local data one.

I don't know how to do this in a way that works in all cases: when need  master-details grids with editing on the details.

Could you provide me a working example of the grid details with Complex binding and data from remote.

     Thanks in advance

     Andrea Perazzolo







Venkatesh Ayothi Raman [Syncfusion]
Replied On September 14, 2016 08:06 AM

Hi Andrea, 

We went through your code example and found that you are binding the JSON result as data source for Grid in row selected event. Here, JSON data source act as a local data source as well as local data source doesn’t send the data on server while editing. This is not a recommended way. 

We have achieved your requirement by modifying the Grid default commonQuery like as follows, 
Code example: 
<RowSelected Event> 
 
rowSelected: function (args) { 
                    this.element.ejWaitingPopup("show"); // Show the waiting popups 
                    var employeeID = args.data.EmployeeID;                     
                    var gridObj = $("#DetailGrid").ejGrid("instance"); 
                    gridObj.commonQuery.queries = []; 
                    gridObj.commonQuery.where("EmployeeID", 'equal', employeeID);// Modifying the query  
                    gridObj.refreshContent(); // refresh the Grid content 
                    this.element.ejWaitingPopup("hide");// hide the waiting popup after filter the data source 
                }, 

If you still face the same issue, then could you please provide more details about your requirement? 

Regards, 
Venkatesh Ayothiraman. 


Andrea Perazzolo
Replied On September 14, 2016 08:53 AM

Hi,
thanks for the reply.
I have tried this solution, but in the process I will lose the complex binding properties that in the first time is binding correctly.

I have not shown in the original post, but I have 2 columns like these:

{ field: "Prodotto.Codice", headerText: "Codice", type: "string", width: 90, allowEditing: false, allowFiltering: true, headerTextAlign: "center" },
{ field: "Prodotto.Descrizione", headerText: "Descrizione", type: "string", width: 300, allowEditing: false, allowFiltering: true, headerTextAlign: "center" },
and if I use the method provided, the columns are blank, because it is lost the Expand call to the OData Query.

   Thanks in advance

    Andrea Perazzolo

Venkatesh Ayothi Raman [Syncfusion]
Replied On September 15, 2016 03:02 AM

Hi Andrea, 

Thanks for the update. 
We are unable to reproduce the issue at our end and we have created a sample for your convenience. Please kindly check the sample from following link, 

Regards, 
Venkatesh Ayothiraman. 


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.

;