Datamanager keep editurl after executequery updates datasource (json)

[Luis Javier Almazan Emery]

I'm working with an editable grid that will be reloaded after a user changes the value of a dropdown. The grid needs to be edited, and is currently working correctly after first load. However when I change the dropdown and update the datasource, the editurl functionality stops working (doesn't call the server controller).

My grid definition:

 Html.EJ().Grid<spStatementItemsGetByID_Result>

                    ("Grid")

                    //.Datasource(Model.StatementItems)

                    .Datasource(ds => ds.URL("../Grid/OpenedDataSource").UpdateURL("../Grid/OpenedUpdate").BatchURL("../Grid/OpenedBatchUpdate").Adaptor(AdaptorType.UrlAdaptor))

                    .Query("new ej.Query().addParams('statementID'," + Model.StatementNameID.ID + ")")

                    .AllowScrolling()

                    .AllowFiltering()

                    .EditSettings(edit => { edit.AllowEditing(); })//.EditMode(EditMode.Batch); })

                    .FilterSettings(filter => { filter.FilterType(FilterType.Menu); })

                    .AllowResizeToFit()

                    .ShowColumnChooser()

                    .ScrollSettings(col => { col.Height("45%"); })

                    .ToolbarSettings(toolBar => toolBar.ShowToolbar().ToolbarItems(items =>

                    {

                        items.AddTool(ToolBarItems.ExcelExport);

                        items.AddTool(ToolBarItems.Edit);

                        items.AddTool(ToolBarItems.Update);

                    }))

                    .Mappers(map => map.ExportToExcelAction("../Grid/StatementItemsExportToExcel"))

                    .Columns(columns =>

                    {

                        columns.Field(p => p.LineID).Visible(false).ShowInColumnChooser(false).IsPrimaryKey(true).Add();

                        columns.Field(p => p.LineName).AllowEditing(false).AllowFiltering(false).HeaderText("Line").Width(150).Width(180).ShowInColumnChooser(false).IsFrozen(true).Add();

                        columns.Field(p => p.Jan).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Feb).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Mar).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Apr).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.May).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Jun).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Jul).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Aug).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Sep).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Oct).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Nov).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.Dec).Format("{0:n}").AllowFiltering(false).ShowInColumnChooser(false).Add();

                        columns.Field(p => p.FY).Format("{0:n}").AllowEditing(false).AllowFiltering(false).Add();

                        columns.Field(p => p.C1st).HeaderText("1st. Qtr").AllowEditing(false).Format("{0:n}").AllowFiltering(false).CssClass("bg-info").Visible(false).Add();

                        columns.Field(p => p.C2nd).HeaderText("2nd. Qtr").AllowEditing(false).Format("{0:n}").AllowFiltering(false).CssClass("bg-info").Visible(false).Add();

                        columns.Field(p => p.C3rd).HeaderText("3rd. Qtr").AllowEditing(false).Format("{0:n}").AllowFiltering(false).CssClass("bg-info").Visible(false).Add();

                        columns.Field(p => p.C4th).HeaderText("4th. Qtr").AllowEditing(false).Format("{0:n}").AllowFiltering(false).CssClass("bg-info").Visible(false).Add();

                        columns.Field(p => p.YTD).Format("{0:n}").AllowEditing(false).AllowFiltering(false).Visible(false).CssClass("bg-info").Add();

                        columns.Field(p => p.LineTypeID).HeaderText("Type").ShowInColumnChooser(false).Visible(false).Add();

                        columns.Field(p => p.Computed).HeaderText("Type").ShowInColumnChooser(false).Visible(false).Add();

                    })

                    .SortSettings(sort => sort.SortedColumns(col => col.Field("LineID").Direction(SortOrder.Ascending).Add()))

                    .ClientSideEvents(eve => eve.QueryCellInfo("querycellinfo").ToolbarClick("OnToolbarClick").BeginEdit("beginEdit").CellEdit("cellEdit").DataBound("gridDatabound"))

)

The function that gets called by the dropdown change:

function changeScenario(args) {

        var ddlMonth = $("#selectMonth").data("ejDropDownList");

        var ddlYear = $("#selectYear").data("ejDropDownList");

        var obj = $("#Grid").ejGrid("instance");

        var statementID = ddlMonth.getSelectedValue();

        var query = new ej.Query().addParams("selectedStatementID", statementID);

        $(':hidden#statenemtID').val(statementID);

        query.addParams("selectedStatemenTitle", ddlMonth.selectedTextValue);

        //Check if there if Year Drop down is defined and add parameter

        if (typeof ddlYear != 'undefined')

            query.addParams("selectedYear", ddlYear.selectedTextValue);

        else

            query.addParams("selectedYear", null);

        //Creating ejDataManager with UrlAdaptor        

        var dm = ej.DataManager({ url: "../Grid/StatementDataSourceStatementID", adaptor: new ej.UrlAdaptor() });

        var promise = dm.executeQuery(query);

        promise.done(function (e) {

            //Assign the result to the grid dataSource using "dataSource" method.            

            var title = e.result.title;

            $("#headerTitle").text(title);            

            $(':hidden#statenemtName').val(title);

            var month = title.charAt(title.indexOf("-") + 2);

            if(!isNaN(month))

                $(':hidden#statementMonth').val(month);

            obj.dataSource(e.result.result);

        });

    }

I have attempted modifying the promise.done(function) to refresh the data manager as follows, but still I wouldn't either load the correct grid in the next change, or it would not call the update url.

Attempted modifications: 

promise.done(function (e) {

            //Assign the result to the grid dataSource using "dataSource" method.            

            var title = e.result.title;

            $("#headerTitle").text(title);            

            $(':hidden#statenemtName').val(title);

            var month = title.charAt(title.indexOf("-") + 2);

            if(!isNaN(month))

                $(':hidden#statementMonth').val(month);

            //Assign the datasource and update urls

            var dmAndData = ej.DataManager({ url: "../Grid/OpenedDataSource", updateUrl: "../Grid/OpenedUpdate", adaptor: new ej.UrlAdaptor() });

            var id = $(':hidden#statenemtID').val();            

            obj.model.query = new ej.Query().addParams("statementID", id); // .Query("new ej.Query().addParams('statementID'," + Model.StatementNameID.ID + ")")

            obj.refreshTemplate();

            obj.dataSource(dmAndData);

            

        }); 

promise.done(function (e) {

            //Assign the result to the grid dataSource using "dataSource" method.            

            var title = e.result.title;

            $("#headerTitle").text(title);            

            $(':hidden#statenemtName').val(title);

            var month = title.charAt(title.indexOf("-") + 2);

            if(!isNaN(month))

                $(':hidden#statementMonth').val(month);

            //Assign the datasource and update urls

            var dmAndData = ej.DataManager({ json: e.result.result, url:"../Grid/OpenedDataSource", updateUrl: "../Grid/OpenedUpdate", adaptor: new ej.remoteSaveAdaptor() });

            obj.dataSource(dmAndData);

        });

[Ragavee U S]

Hi Luis,  

Thanks for your interest in Syncfusion products.  

The UpdateURL property of the DataManager will not be triggered when the editMode is batch. The corresponding property of the DataManager for “batch” editMode is BatchURL.

Since the batch edit functionality performs the CRUD operation as a whole; all the added, edited, deleted record details will be passed to the server as list of records. The InsertURL, UpdateURL and RemoveURL properties will not be triggered as on performing CRUD operations in grid it will be locally saved in grid and only on clicking the update icon in grid toolbar, a post action with all the batch changes will be triggered which is handled using BatchURL property.

The Server-Side function is declared with the following parameters for editing functionality.

Parameters Table   

Action	Parameter Name	Example
Batch Add	added	public ActionResult BatchUpdate(List<Orders> changed, List<Orders> added, List<Orders> deleted){}
Batch Update	changed
Batch Delete	deleted

Please refer to the below documentation for more information.   

https://help.syncfusion.com/aspnetmvc/grid/editing#batch-url   

Online Sample link: http://mvc.syncfusion.com/demos/web/grid/batchediting  

Regards,  

Ragavee U S.  

[Luis Javier Almazan Emery]

Hi, current editmode is "normal". editmode.batch is commented in the code. See attached image in zip.

Attachment: EditMode_6e36ae4a.7z

[Ragavee U S]

Hi Luis, 

We are sorry but the issue is not reproduced at our end. We have prepared a sample in v14.4.015 such that the dataSource of the Grid is updated on the change event of the external dropdownlist, which can be downloaded from the below location. 

http://www.syncfusion.com/downloads/support/directtrac/general/ze/Sample2086267594 

Please try the above sample and if you still face any difficulties, share the following details. 

1.       Product version details. 

2.       Network tab of the developer tool showing the post failure. 

3.       Video demo of the issue. 

4.       If any script error thrown while saving the grid data, please share the screenshot of the stack trace of the error. 

5.       If possible, please reproduce the issue in the above provided sample and share. 

Regards, 

Ragavee U S. 

[Scott]

I am using Syncfusion.EJ.MVC Version 15.2500.040 (Runtime Version v4.0.30319)

I am having effectively the same problem.  I have a Grid where I allow Edit via a RemoteSaveAdapater as shown below:

@(Html.EJ().Grid<FLWeb.Models.Account>("FlatGrid")

                .Datasource(ds => ds.Json((IEnumerable<object>)ViewBag.datasource).UpdateURL("/FL_Account/Update")

                .InsertURL("/FL_Account/Insert").RemoveURL("/FL_Account/Remove").Adaptor(AdaptorType.RemoteSaveAdaptor))

                .AllowSorting()

               // .AllowPaging()

               .EditSettings(edit => { edit.AllowAdding().AllowDeleting().AllowEditing().EditMode(EditMode.DialogTemplate).DialogEditorTemplateID("#template"); })

                   .ToolbarSettings(toolbar =>

                   {

                       toolbar.ShowToolbar().ToolbarItems(items =>

                       {

                           items.AddTool(ToolBarItems.Search);

                           //items.AddTool(ToolBarItems.Add);

                           //items.AddTool(ToolBarItems.Edit);

                           //items.AddTool(ToolBarItems.Delete);

                           //items.AddTool(ToolBarItems.Update);

                           //items.AddTool(ToolBarItems.Cancel);

                       });

                   })

                               .AllowPaging()

            .PageSettings(page => page.PageSize(15))

            .AllowSorting()

            .AllowGrouping()

            .AllowResizeToFit()

            .AllowFiltering()

            .FilterSettings(filter => { filter.FilterType(FilterType.Excel); })

        // .AllowFiltering()

        .IsResponsive(true)

        // .EnableResponsiveRow(true)

        .Columns(col =>

        {

            col.Field("ClientAcctID").IsPrimaryKey(true).Visible(false).Add();

            col.Field("AccountName").Width(100).Add();

            col.Field("GroupName").Width(100).Add();

            col.Field("PrimaryPhone").Width(60).HeaderText("Phone").Add();

            col.Field("OfficeType").Width(50).Add();

            col.Field("AcctTeamName").Width(50).HeaderText("Team").Add();

            col.Field("City").Width(100).Add();

            col.Field("State").Width(30).Add();

            col.Field("Zip").Width(40).Add();

            col.Field("ActiveAcct").Width(30).Add();

        }

        )

The grid uses a Dialog Editor template where like Luis, it works somewhat reliabily on the first load of the view.  In other words if I go to the View and I edit record #1, I can see the controller method being called, and data being handled on the server etc. However, if I attempt to edit the same record a second time, the controller action is never called.  I likewise don't see any errors on the client (browser debugging tools), which leaves me with little I can troubleshoot.  

Please advise!

[Mani Sankar Durai]

Hi Scott, 

We have analyzed your query and we are not able to reproduce the reported issue.  We have also prepared a sample based on the code example given and that can be downloaded from the below link 

Link: http://www.syncfusion.com/downloads/support/directtrac/188958/ze/EntityCodeFirst-473967272 

We have also checked the continuous editing for the same and also for the different row. 

If you still face the issue please get back to us with the following details, 

1.       Share the screenshot of the issue.  

2.       Share the screenshot of how the post has been processing in network tab and what is response from that. 

3.       Share the controller page. 

4.       Share the hosted site. 

5.       If possible please reproduce the issue in the above attached sample. 

The provided information will help us to analyze the issue and provide you the response as early as possible. 

Regards, 

Manisankar Durai.