简体   繁体   中英

Kendo UI Grid Saving

I am relatively new to Kendo UI. I have my code setup like this. This basically displays editable grid with dropdowns in each column and Adding another record will add a new row of Dropdowns. Is there anyway i can save all the rows at once rather than updating each row individually? My code is setup like this.

<div class="row">
    <div class="col-md-12 ">
        <h5>Markets:</h5>
        @(Html.Kendo().Grid<ETS_Telerik.Models.AddMarketViewModel>()
            .Name("MarketGrid")
            .Columns(columns =>
            {
                columns.Bound(p => p.Country).ClientTemplate("#: Country.Name #").Width("200px");
                columns.Bound(p => p.State).ClientTemplate("#: State.StateName #").Title("State").Width("200px") ;
                columns.Bound(p => p.Name).Width(200);
                columns.Command(command => { command.Destroy(); });
            })
            .ToolBar(toolbar => toolbar.Create())
            .Editable(editable => editable.Mode(GridEditMode.InCell))
            .DataSource(dataSource => dataSource
                .Ajax()
                    .Model(model =>
                    {
                        model.Id(p => p.ID);
                        model.Field(p => p.Country).DefaultValue(ViewData["defaultCountry"]);
                        model.Field(p => p.State).DefaultValue(ViewData["defaultState"]);
                        model.Field(p => p.Name).DefaultValue(ViewData["defaultName"]);
                    })
                .Create(update => update.Action("CreateEmployee", "User"))
                .Read(read => read.Action("ReadEmployees", "User"))
                .Destroy(del=>del.Action("Delete","User"))
                .Update(update => update.Action("UpdateEmployees", "User")))
                )
    </div>
</div>

Using below code you can acheive the whole data update.

$('#updateall').click(function (){
        var displayedData = $("#your-gridid").data().kendoGrid.dataSource.view();
        var Childfood=[];
        for(var i=0;i<displayedData.length;i++)
        {
            var fooddata = {
                "ChildId"           :   displayedData[i].ChildId,
                "MorningFood"       :   $("#MorningFood").val(),

            }
            Childfood.push(fooddata);
        }
        Childfood = JSON.stringify({ 'Childfood': Childfood });
        var postData = { Childfood: Childfood};
        $.ajax({
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: 'POST',
            url: '/your-controller/method',
            data: Childfood,
            success: function () {

            },
            failure: function (response) {
            }
        });
    });


    [HttpPost]
        public JsonResult Recordallchildfood(List<Childfood> Childfood)
        {

        var datalist=Childfood;
        //---------
        //your operation bulk update to sql
        //---------

        return Json(returnlist, JsonRequestBehavior.AllowGet);
    }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM