undefined after selecting item

2 posts, 1 answers
  1. Steve
    Steve avatar
    35 posts
    Member since:
    Apr 2015

    Posted 27 May 2015 Link to this post

    Hey Guys,

    I have been stuck on this issue for a day now and still can’t figure it out.  
    The issue is that the drop down list in the grid column always return 'undefined' after selecting an item and moving to the next column.  
    It will display the last selected item if I go back to the drop down list.  I am not sure if I need to refresh the grid or it's not proper bind to the field.
    Any help is appreciated.  Below are the codes.

     

    TIA


    A call back for json and literate through a loop to set up my data

    var ds = new kendo.data.DataSource({
                transport: {
                    read: function (options) {
                        var myData = [];

    var tCounter = 0;
    json call here ......
    function (result) {
      for (var i = 0; i < result.length; i++) {

    for (var j = 0; j < result[i].TS.length; j++) {
    var rData = [];

    for (var m = 0; m < result[i].TS[j].DRP.length; m++) {                                
    rData[m] = {                                                                                                    
    nextId: result[i].TS[j].DRP[m].Id,                                                    
    nextDesc: result[i].TS[j].DRP[m].Description
    }
    }

    myData[tCounter] = {
    ...other variables
    rList: rData,
    };
    tCounter ++;
    };
                        };                                                      
    });
    options.success(myData);
                  }
                },
                schema: {
                    model: {
                        id: "Id",
                        fields: {
                            JN: { editable: false },
                            TI: { editable: false },
                            rList: { editable: true }
                        }
                    }
                },
            });


            var test = $("#grid").kendoGrid({
                dataSource: ds, 
                columns: [
                {
                  ...'other column settings'
                },
                {
                    field: 'rList',
                    title: 'Next',
                    width: 200,
                    template: "#=rList.nextDesc#",   // I think is causing the issue
                    editor: dropDownEditor
                },
        }],
    editable: true,
    navigatable: true
    }).data("kendoGrid");


       function dropDownEditor(container, options) {
            var iData = [];
            for (var i = 0; i < options.model.rList.length; i++) {
                iData.push({ nextDesc: options.model.rList[i].nextDesc, nextId: options.model.rList[i].nextId });
            }

            //iData = [{ nextDesc: "ABC", nextId: "123" },
            //                 { nextDesc: "CDF", nextId: "456" },
            //                 { nextDesc: "HIJ", nextId: "789" }];
            var ddl = $('<input data-text-field="nextDesc" data-value-field="nextId" data-bind="value:' + options.field + '"/>')
                .appendTo(container)
                .kendoDropDownList({
                    optionLabel: ' ',
                    autoBind: false,
                    dataSource: iData,
                    dataTextField: "nextDesc",
                    dataValueField: "nextId"

                });
        }

  2. Answer
    Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 29 May 2015 Link to this post

    Hello Steve,

    Based on the given code snippet, I believe that the model filed (rList) is actually an array of objects. If my assumption is correct, then DropDownList widget will not work as expected with it. It can be used to update primitive or object value, not arrays. If updating an array is a must, then you will need to use MultiSelect widget.

    If I am missing something in the described scenario, please send us a repro demo (http://dojo.telerik.com).

    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top