DropDown in Kendo UI Grid showing Object-Object after selecting option from drop down list

Question

I am using kendo grid in my application. In that grid, I have used kendo drop down list. I have an array for datasource of that dropdownlist. The array looks like

var arr = [{text: "demo 1", value: 1}, {text: "demo 2", value: 2}]

My Dropdownlist Looks like:

    $("#grid").kendoGrid({
        dataSource: dataSource,
        navigatable: true,
        pageable: true,
        height: 550,
        filterable: {
            mode: "row"
        },
        sortable: {
            mode: "single",
            allowUnsort: false
        },
        toolbar: ["create"],
        columns: [
            { field: "Item", title: "Item", width: "300px", editor: categoryDropDownEditor }
        ],
        editable: true
    });

    function categoryDropDownEditor(container, options) {
        $('<input data-text-field="text" data-value-field="value" data-bind="value:' + options.field + '" />')
            .appendTo(container)
            .kendoDropDownList({
                dataSource: arr,
                autoBind: true,
                dataTextField: "text",
                dataValueField: "value",
            });
    }

It is showing the text in dropdown correctly but after selecting the option from drop down it shows object object as a selected text.

Attached the screenshot of the drop down selected value and after option after selecting Image of option selecting and After option selected

I have tried a lot of solutions but didn't work. It will be great if someone provides the solution.

Thanks

Punit · Accepted Answer · 2017-08-22 06:30:24Z

1

I Just Have Updated "Cara Tilos's" Jsfiddle code,

http://jsfiddle.net/0zauzskn/5/

This will give you your desired result.

I have added

schema: {
    model: {
        fields: {
            item: { type: "string" }
        }
    }
}

Into your dataSource

Best Of Luck.

answered Aug 22, 2017 at 6:30

Punit

4603 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Gourav Over a year ago

Thanks for the response but that is not working because I have change dataValueField from text to value as I want to get the selected option's value to process it further. In your fiddle it is returning text instead of value as dataValueField is mentioned as text.

Cara · Accepted Answer · 2017-08-21 08:14:52Z

0

Try removing the data-text-field and data-value-field on your categoryDropDownEditor.

Made a jsFiddle for you. Check this one.

answered Aug 21, 2017 at 8:14

Cara

6445 silver badges10 bronze badges

3 Comments

Gourav Over a year ago

The fiddle provided by you also has same issue. Try adding new record and then select the option from drop down. It is showing "object object"

Cara Over a year ago

I added a valuePrimitive on kendoDropDownList. jsfiddle.net/0zauzskn/6

Gourav Over a year ago

Thanks but adding valuePrimitive shows me the value of that option if I use dataValueField: "value" instead of "text". I have to add dataValueField as value because I need to save it in DB.

Collectives™ on Stack Overflow

DropDown in Kendo UI Grid showing Object-Object after selecting option from drop down list

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related