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

DropdownList not loading in Defaultly in Grid

2 Answers 119 Views

Grid

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

2 Answers, 1 is accepted

answered on 05 May 2020, 04:20 PM

Hello, Mohammed,

Thank you for this question.

In general the ClientTemplate functionality of the Kendo UI Grid is especially for rendering HTML elements. Usually it is not used as an editor.
Below is a code snippet with needed logic:

In columns bound:

columns.Bound(c => c.Category).HtmlAttributes(new { @class="templateCell"}).ClientTemplate(
                Html.Kendo().DropDownList().Name("ddl#=OrderID#")
                .DataValueField("CategoryId")
                .DataTextField("CategoryName")
                .HtmlAttributes(new { data_bind="value: Category"})
                .BindTo(new List<Category>() { new Category() { CategoryId=1, CategoryName="Name1"},
                 new Category() { CategoryId=2, CategoryName="Name2"}
                })
                .ToClientTemplate().ToHtmlString()
                ).Width(100);
            columns.Command(c => c.Edit());

After DataSource functionality add in .Events this code:

.Events(ev => ev.DataBound("bindRowToDataItem"))

For the javascript part use this:

<script>
    function bindRowToDataItem(e) {
        var grid = e.sender;
        $(".templateCell").each(function () {
            eval($(this).children("script").last().html());
            var row = $(this).closest("tr");
            var dataItem = grid.dataItem(row);
            kendo.bind($(row), dataItem);
        });
    }
</script>

Another way to achieve desired behavior can be found in this demo:
https://dojo.telerik.com/UGeroder

Let me know if any further assistance is needed.

Regards,
Anton Mironov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.