Using an Autocomplete control inside a custom popup editor for a Grid

[Wim]

I'm using a custom template for my grid's popup editor, so I can only display the fields that may be edited. In this template, I'd like to use an an auto complete input. I've got it 'working': the control is in the editor template and does what an auto complete should do.

However, the box won't fill from the existing Grid data, and it won't save when I save the changes. How can I make sure Kendo still uses it as a field for my model, but also as an auto complete control?

The grid:

01.@(Html.Kendo().Grid<Receipt>()
02.    .Name("GridReceipts")
03.    .Columns(columns => {
04.        columns.Bound(o => o.Id);
05.        columns.Bound(o => o.Supplier);
06.        columns.Bound(o => o.Status);
07.        columns.Command(c => {
08.            c.Edit().Text(" ");
09.            c.Destroy().Text(" ");
10.        });
11.    })
12.    .DataSource(d => d
13.        .WebApi()
14.        .Model(m => m.Id(o => o.Id))
15.        .Create(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Receipts" })))
16.        .Read(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Receipts" })))
17.        .Update(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Receipts", id = "{0}" })))
18.        .Destroy(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Receipts", id = "{0}" })))
19.    )
20.    .ToolBar(toolbar => toolbar.Create())
21.    .Editable(e => e.Mode(GridEditMode.PopUp).TemplateName("Receipt"))
22.    .Deferred()
23.)

The auto complete (in the editor template):

01.@model Receipt
02.
03.<div class="k-edit-label">@Html.LabelFor(m => m.Supplier)</div>
04.    <div class="k-edit-field">
05.    @(Html.Kendo().AutoCompleteFor(m => m.Supplier)
06.        .Name("ACSupplier")
07.        .DataSource(s => {
08.            s.Read("Autocomplete", "Suppliers");
09.        })
10.        .DataTextField("Name")
11.        .MinLength(2)
12.    )
13.</div>

[Alexander Popov]

Hello Wim,

This happens because the AutoComplete widget uses a name, different from the Model field it represents. Basically, the value binding is created using the name of the widget, so in this case the widget is bound to a ACSupplier field, which does not exist in the Grid's Model. Removing the custom name should solve the issue.

Regards,
Alexander Popov
Telerik

 

 

[Wim]

I tried giving it the same name, which didn't work. I didn't think to just leave out the name, which works just fine, as you suggest.

Thank you very much!