KendoUI Grid with custom dropdown column passing whole object instead of Id

Question

I am using Kendo UI with Angular/Breeze. I have an editable grid with one column being a drop-down menu. Everything works fine until the save happens. The problem is my odata call is expecting:

Id(guid), Name, Description, CategoryId(guid)

When the drop-down is changed it triggers a save command and sends back like this:

Id(guid), Name, Description, Category(categoryId, Name, Desc)

Where and How do I make the grid send back only the `categoryId instead of the whole category object?

    vm.columns = [
        { field: 'name', title: 'name' },
        { field: 'desc', title: 'description' },
        {
            field: 'categoryId',
            title: 'group',
            template: getCategory,
            editor: categoryDropDown
        }
    ];

    function categoryDropDown(container, options) {
        $('<input data-text-field="categoryName" data-value-field="categoryId" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({
                dataTextField: "categoryName",
                dataValueField: "categoryId",
                dataSource: vm.categories
            });
    }

    function getCategory(item) {
        for (var i = 0, length = vm.category; i < length; i++) {
            console.log(vm.categories[i].categoryId);
            if (vm.categories[i].categoryId === item.categoryId) {
                return vm.categories[i].categoryName;
            }
        }
        return '';
    }

Here is the schema for the main datasource:

schema: {
    model: {
       id: 'Id',
       fields: {
         categoryName: { editable: true },
         categoryDesc: { editable: true },
         categoryId: { editable: true }
       }
    }
}

In the Model Try setting the Type as string categoryId: { editable: true , type: "string" }, — cwishva, Aug 15 '14 at 08:03

score 6 · Accepted Answer · answered Aug 19 '14 at 18:24

6

valuePrimitive was the missing key

    function categoryDropDown(container, options) {
       $('<input data-text-field="categoryName" data-value-field="categoryId" data-bind="value:' + options.field + '"/>')
           .appendTo(container)
           .kendoDropDownList({
               dataTextField: "categoryName",
               dataValueField: "categoryId",
               dataSource: vm.categories,
               valuePrimitive: true
           });
    }

answered Aug 19 '14 at 18:24

Boone

1,046
1
12
30

Thank you so much. I was wondering: where did you find that property? I looked over google and couldn't find anything such as a list of configuration properties. – MaximeBernard Oct 09 '14 at 15:14
I can't remember. I think I just happened to see an example with that in there and then happened to look it up. – Boone Nov 05 '14 at 18:56

KendoUI Grid with custom dropdown column passing whole object instead of Id

1 Answers1