CODEWITHSUNDEEP
kendo-uikendo-gridkendo-combobox
NSS
NSS

Reputation: 2022

KendoUI Combobox Configure for Complex Objects

I am binding the Combobox to a complex Object, the binding is such that ID field is available as a direct property on this object but the Text Property is coming from a child objects property.

I have been able to configure it show the values correctly, but running into problem to specify the optionLabel saying "select" not able to specify Parent.Childproperty getting runtime error (Uncaught TypeError: Cannot read property 'Childproperty' of undefined )

How can i specify Complex Objects in the Model defination and below for the empty selection ?

   $('<input id="DegreeDDL" name="' + options.field + '"/>').appendTo(container).kendoDropDownList({
            autoBind: true,
            serverFiltering: true,
            optionLabel: {
                'Parent.Childproperty': "--- Select ---",
                ABCD_PK: null

            },
            dataSource: {
                transport: {
                    read: {
                        url: function (e) {
                            return "api/Org/XXXXXXXX?abcdPK=" + efgh;
                        },
                        dataType: "json" // <-- The default was "jsonp"
                    }
                },
            },
            dataTextField: "Parent.ChildProperty",
            dataValueField: "ABCD_PK"
        });

Also running into similar propblem when defining model for the grid

 var model = {
        id: "ABCD_PK",
        fields: {
            Parent.Child.ChilProperty: 
                }
             }

Upvotes: 1

Views: 1263

Answers (1)

Jarosław Kończak
Jarosław Kończak

Reputation: 3407

To answer your first question: use optionLabel as string if creating object here causes errors:

optionLabel: "--- Select ---",

Here is working JSFiddle: http://jsfiddle.net/a6Ek2/11/

To answer your second question just use dataSource.schema to parse your json for non complex object. More in this topic: How can I use nested Json to populate Kendo UI grid?. Grid official do not working with complex data objects. But if you wanna give a try you delclare only parent object in model eg:

fields: {
    ABCD_PK: { editable: false },
    Parent: { editable: true },
}

If you still got problem with this just update this JSFiddle and show exacly where this is. I'll try improve my answers then.

Upvotes: 1

Related Questions