This is a migrated thread and some comments may be shown as answers.

Local Binding Not Working, Issues Ajax Call

1 Answer 401 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Andy
Top achievements
Rank 1
Veteran
Andy asked on 04 Aug 2020, 10:30 AM

I have a grid that I want to bind to local data.  When I try to add a record, the widget tries to make an Ajax post back, instead of adding to the IEnumerable<T>.

I'm running ASP Dot Net Core 3.1 with Razor Pages and Telerik 2020.2.617

My Razor Page is as follows:

@(Html.Kendo().Grid<CreateModel.ModelItem>().Name("grid")
    .AutoBind(true)
    .BindTo((IEnumerable<CreateModel.ModelItem>)Model.Data.LineItems)
    .Columns(cols =>
    {
        cols.Bound(c => c.Id);
        cols.Bound(c => c.Line);
        cols.Bound(c => c.Description);
        cols.Bound(c => c.Qty);
        cols.Bound(c => c.Value);
        cols.Command(c =>
        {
            c.Edit();
            c.Destroy();
        });
    })
    .Editable(GridEditMode.InLine)
    .Pageable()
    .DataSource(ds=>
        ds.Ajax()
        .Batch(false)
        .ServerOperation(false)
        .Model(m=>
        {
            m.Id(id => id.Id);
            m.Field(f => f.Id).DefaultValue(Guid.Empty);
            m.Field(f => f.Line).DefaultValue(1);
            m.Field(f => f.Description);
            m.Field(f => f.Qty).DefaultValue(1);
            m.Field(f => f.Value).DefaultValue(0.00m);
        })
    )
    .ToolBar(t=>
    {
        t.Create().Text("Add Line Item");
        t.Save();
    })
)

1 Answer, 1 is accepted

Sort by
0
Anton Mironov
Telerik team
answered on 07 Aug 2020, 11:25 AM

Hello, Andy,

Apologize for the delay and thank you for the provided code snippet.

After a thorough examination of the code, I noticed that the grid uses both BindTo and Ajax binding which is actually not supported. Since the grid seems to enable data editing I would recommend using only Ajax binding. Attached you can find a sample project (that can be used as a starting point) that follows the described scenario and illustrates a possible realization.

Furthermore, try setting the CRUD operations in the grid's DataSource. Here is an example:

 .DataSource(ds => ds.Ajax()
            .Read(r => r.Url("/Index?handler=Read").Data("forgeryToken"))
            .Update(u => u.Url("/Index?handler=Update").Data("forgeryToken"))
            .Create(c => c.Url("/Index?handler=Create").Data("forgeryToken"))
            .Destroy(d => d.Url("/Index?handler=Destroy").Data("forgeryToken"))
            .Model(m => m.Id(id => id.OrderID))
        .PageSize(10)
    )

Let me know if further assistance is needed.

 

Best Regards,
Anton Mironov
Progress Telerik

Tags
Grid
Asked by
Andy
Top achievements
Rank 1
Veteran
Answers by
Anton Mironov
Telerik team
Share this question
or