kendoDropDownList on the Grid displaying null after Save

2 posts, 0 answers
  1. Raj
    Raj avatar
    2 posts
    Member since:
    Mar 2016

    Posted 28 Aug 2017 Link to this post

    After I select an item from Dropdownlist and hit save, Grid is not displaying the description corresponding to the Id value returned from the service.

    Here is the code snippet...

    $("#grid").kendoGrid({
                dataSource: dataSource,
                pageable: false,
                columns: [
                    {
                        field: "TransferTypeId",
                        title: "Transfer Type",
                        template: "#:TransferType#",
                        width: 150,
                        editor: function (container, options) {
                            $('<input data-bind="value:' + options.field + '" required/>')
                                 .appendTo(container)
                                 .kendoDropDownList({
                                     autoBind: true,
                                     dataTextField: "Value",
                                     dataValueField: "Key",
                                     valuePrimitive: true,
                                     dataSource: {
                                         transport: {
                                             read: {
                                                 url: THIS_APP_PATH + "Api/Lookup/TransferType"
                                             }
                                         }
                                     }
                                 });
                        }
                    }] });

             What am I missing here?

             Appreciated for your help.

     

  2. Stefan
    Admin
    Stefan avatar
    3078 posts

    Posted 30 Aug 2017 Link to this post

    Hello Raj,

    Based on the provided information I can assume that the issue occurs because the TransferTypeId.Value has to be set inside the template.

    In general, when a DropDown is used its value is originally a complex object and the template should reference the property of that object that has to be displayed.

    This can be observed in our demo example:

    http://demos.telerik.com/kendo-ui/grid/editing-custom

    { field: "Category", title: "Category", width: "180px", editor: categoryDropDownEditor, template: "#=Category.CategoryName#" },

    I hope this is helpful.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top