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

How to position new rows at the bottom of the grid in RemoteDataAdapter?

Hello, I am using a syncfusioin grid with the remote data adapter. and I am using add and edit features of the grid. when I add a row in a grid it always adding it first. I wanted to add it at bottom of the grid. how can I achieve this?
I have looked into below article and followed it. but it's not working for me

https://www.syncfusion.com/forums/131930/how-to-position-new-rows-at-the-bottom-of-the-grid

In this when I use code of action complete it throws an error 

Uncaught TypeError: this.model.dataSource.shift is not a function

Below is my code for reference

In View

@(Html.EJ().Grid<AssignedProductMaterialViewModel>("GridProductMaterials")
                                                                                                          .Datasource(datasource => datasource.Json((IEnumerable<AssignedProductMaterialViewModel>)Model.ProductMaterials).UpdateURL(@Url.Action("UpdateProductMaterial")).InsertURL(@Url.Action("CreateProductMaterial")).RemoveURL(@Url.Action("RemoveProductMaterial")).Adaptor(AdaptorType.RemoteSaveAdaptor))
                                                                                                           .EditSettings(edit => { edit.AllowAdding().AllowEditing().AllowEditOnDblClick(false).EditMode(EditMode.InlineForm).ShowConfirmDialog(true).TitleColumn("Description"); })
                                                                                                               .Query("new ej.Query().addParams('ProductId', " +Model.Id +")")
                                                                                                               .ToolbarSettings(toolbar =>
                                                                                                               {
                                                                                                                   toolbar.ShowToolbar().ToolbarItems(items =>
                                                                                                                   {
                                                                                                                       items.AddTool(ToolBarItems.Add);
                                                                                                                   });
                                                                                                               })
                                                                                                         .AllowResizing(true).AllowRowDragAndDrop(true).SelectionType(SelectionType.Single)
                                                                                                         .EnableAltRow().AllowResizeToFit(true)
                                                                                                         .EnableHeaderHover()
                                                                                                         .Columns(col =>
                                                                                                         {
                                                                                                             col.Field(x => x.UnitQty)
                                                                                                                 .HeaderText("UnitQty")
                                                                                                                 .TextAlign(TextAlign.Center).EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                                 .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                                 .Width(40)
                                                                                                                 .Add();
                                                                                                             col.Field(x => x.Id)
                                                                                                                  .HeaderText("Id")
                                                                                                                  .TextAlign(TextAlign.Left).IsPrimaryKey(true).IsIdentity(true).AllowEditing(false).Visible(false)
                                                                                                                  .Width(100)
                                                                                                                  .Add();

                                                                                                             col.Field(x => x.Description)
                                                                                                                    .HeaderText("Description")
                                                                                                                    .TextAlign(TextAlign.Center).EditType(EditingType.StringEdit)
                                                                                                                    .ValidationRules(v => v.AddRule("maxlength", 255))
                                                                                                                    .Width(110)
                                                                                                                    .Add();
                                                                                                             col.Field(x => x.BeamLength)
                                                                                                                   .HeaderText("BeamLength")
                                                                                                                   .TextAlign(TextAlign.Center)
                                                                                                                    .EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                                 .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                                   .Width(60)
                                                                                                                   .Add();
                                                                                                             col.Field(x => x.SawDepth)
                                                                                                                  .HeaderText("SawDepth")
                                                                                                                  .TextAlign(TextAlign.Center)
                                                                                                                   .EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                                 .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                                  .Width(50)
                                                                                                                  .Add();
                                                                                                             col.Field(x => x.Thickness)
                                                                                                                 .HeaderText("Thickness")
                                                                                                                 .TextAlign(TextAlign.Center)
                                                                                                                .EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                                 .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                                 .Width(50)
                                                                                                                 .Add();
                                                                                                             col.Field(x => x.Machine)
                                                                                                                 .HeaderText("Machine")
                                                                                                                 .TextAlign(TextAlign.Center).EditType(EditingType.StringEdit)
                                                                                                                  .ValidationRules(v => v.AddRule("maxlength", 255))
                                                                                                                 .Width(70)
                                                                                                                 .Add();
                                                                                                             col.Field(x => x.Edge)
                                                                                                                .HeaderText("Edge")
                                                                                                                .TextAlign(TextAlign.Center)
                                                                                                                 .ValidationRules(v => v.AddRule("maxlength", 255))
                                                                                                                .Width(40)
                                                                                                                .Add();
                                                                                                             col.Field(x => x.TapeThickness)
                                                                                                               .HeaderText("TapeThickness")
                                                                                                               .TextAlign(TextAlign.Center)
                                                                                                              .EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                                 .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                               .Width(70)
                                                                                                               .Add();
                                                                                                             col.Field(x => x.WorkInstruction)
                                                                                                               .HeaderText("WorkInstruction")
                                                                                                               .TextAlign(TextAlign.Center).EditType(EditingType.StringEdit)
                                                                                                               .ValidationRules(v => v.AddRule("maxlength", 255))
                                                                                                               .Width(75)
                                                                                                               .Add();
                                                                                                             col.Field(x => x.FinishedLength)
                                                                                                               .HeaderText("FinishedLength")
                                                                                                               .TextAlign(TextAlign.Center)
                                                                                                                  .EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                                 .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                               .Width(75)
                                                                                                               .Add();
                                                                                                             col.Field(x => x.SizeDepth)
                                                                                                               .HeaderText("SizeDepth")
                                                                                                               .TextAlign(TextAlign.Center)
                                                                                                               .EditType(EditingType.NumericEdit).NumericEditOptions(new EditorProperties() { DecimalPlaces = 0 })
                                                                                                               .ValidationRules(v => v.AddRule("required", true).AddRule("maxlength", 255))
                                                                                                               .Width(60)
                                                                                                               .Add();
                                                                                                             col.HeaderText("Actions")
                                                                                                             .Template(
                                                                                                             "<a rel='nofollow' href='javascript:void(0)' data-productmaterial-id='{{:Id}}' class='btn-white btn btn-xs edit-data productmaterial-update-button'>Edit</a> &nbsp" +
                                                                                                             "<a rel='nofollow' href='javascript:void(0)' data-productmaterial-id='{{:Id}}' class='btn-white btn btn-xs edit-data productmaterial-delete-button'>Delete</a>"
                                                                                                         ).AllowEditing(false)
                                                                                                           .TextAlign(TextAlign.Center)
                                                                                                           .Width(70).
                                                                                                           Add();
                                                                                                         })
                                                                                         .ClientSideEvents(events =>
                                                                                         {
                                                                                             events.ActionFailure("mrp.productDetails.productMaterialActionFailure");
                                                                                             events.ActionComplete("mrp.productDetails.productMaterialActionComplete");
                                                                                             events.RowDrop("mrp.productDetails.productMaterialsRowDrop");
                                                                                         })


In Action Complete method as below 
 if (args.requestType == "save") {
            this.model.dataSource.shift(); // in this line it throws error.
            this.model.dataSource.push(args.data)// Push the newly added record in data source
            this.refreshContent();
        }


1 Reply

VN Vignesh Natarajan Syncfusion Team November 19, 2018 11:55 AM UTC

Hi Sandip, 
 
Thanks for using Syncfusion products.  
 
Query:- Uncaught TypeError: this.model.dataSource.shift is not a function 
 
From your query, we understand that you are facing issue while implementing the suggestion provided in another forum. In that forum we have provided solution to achieve their requirement for local data. While using RemoteSave Adaptor we cannot get the this.model.dataSource. so the script error is thrown. Instead, you need to get the dataSource on this.model.dataSource.dataSource.json.shift() as like below code example 
 
@(Html.EJ().Grid<object>("FlatGrid") 
           .Datasource(ds => ds.Json((IEnumerable<object>)ViewBag.datasource).UpdateURL("/Grid/CellEditUpdate").InsertURL("/Grid/CellEditInsert").RemoveURL("/Grid/CellEditDelete").Adaptor(AdaptorType.RemoteSaveAdaptor)) 
             
            .Columns(col => 
            { 
                col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right) 
                    .Width(90).Add(); 
                     .      .      . 
               }) 
                    .ClientSideEvents(eve => 
                    { 
                        eve.ActionComplete("complete"); 
                    }) 
) 
<script type="text/javascript"> 
    function complete(args) { 
        if (args.requestType == "save") { 
            this.model.dataSource.dataSource.json.shift();// Remove the newly added record from first position 
            this.model.dataSource.dataSource.json.push(args.data)// Push the newly added record in data source 
            this.refreshContent(); 
        } 
    } 
 
</script> 
 
 
 
Please get back to us if you need any further assistance. 
 
Note: above solution will work only for remoteSaveAdaptor, will not work for UrlAdaptor. 
 
Regards, 
Vignesh Natarajan 
 


Loader.
Live Chat Icon For mobile
Up arrow icon