This is a migrated thread and some comments may be shown as answers.

Embedded Drop Down List not returning data in a format the grid can handle

2 Answers 7 Views
Grid
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 13 Mar 2019, 02:54 PM

I have created a drop down list embedded within my grid using the demo: https://demos.telerik.com/kendo-ui/grid/editing-custom

For some reason when I select an option within the drop down it doesn't send the data back in a format the grid can use, however the default value (if I don't touch drop down) works just fine.

 

My datasource designed as such: 

schema: {
    model: {
        id: "SwitchID",
        fields: {
            SwitchID: { editable: false, type: "number" },
            switchperson: {
                type: "string",
                validation: { required: true, message: "Switchperson information is required." },
            },
            phoneNum: { type: "string" },
            Location: { type: "string" },                  
            SwitchPersonType: { defaultValue: { switchPersontypeValue: "Employee", switchPersontypeID: 1 } },
            //SwitchPersonType: { type: "string" },
             
        },
    },
},

and the kendo grid:

$("#switchpersonTable").kendoGrid({
    dataSource: switchpersonDataSource,
    scrollable: true,
    sortable: true,
    filterable: false,
    pageable: true,
    toolbar: [{ name: "create", text: "Add Switchperson" }],
    columns: [
        { field: "switchperson", title: "Switchperson", width: "200px" },
        { field: "phoneNum", title: "Phone #", width: "200px" },
        { field: "Location", title: "Location", width: "200px" },
        {
            field: "SwitchPersonType",
            title: "Type",
            width: "150px",
            template: "#=SwitchPersonType.switchPersontypeValue#",
            editor: switchPersonTypeDropDownEditor,
        },
        { command: ["edit", "destroy"], title: " ", width: "200px" },
    ],
    editable: "inline",
});

The editor is the built like this:

$(
    '<input required name="' + options.field + '" data-text-field="switchPersontypeValue" data-value-field="switchPersontypeID" data-bind="value:' +
        options.field +
        '"/>'
)
    .appendTo(container)
    .kendoDropDownList({
        autoBind: false,
        dataSource: {
            data: ddlSwitchPersonType,
        },
    });

and the data source for the drop down list:

var ddlSwitchPersonType = [
    {
        switchPersonTypeID: 1,
        switchPersontypeValue: "Employee",
    },
    {
        switchPersonTypeID: 2,
        switchPersontypeValue: "Contractor",
    },
];

If I create an item in the grid and don't touch the dropdown I get the following back in the e.data:

Location: ""
SwitchID: 0
SwitchPersonType:
            switchPersontypeID: 1
            switchPersontypeValue: "Employee"
__proto__: Object
phoneNum: ""
switchperson: "sdaf"
__proto__: Object

But if I select an option (even the default) the data doesn't come back as an object.  It only sets a field called SwitchPerson 

Location: ""
SwitchID: 0
SwitchPersonType: "Employee"
phoneNum: ""
switchperson: "sdf"
__proto__: Object

Any thoughts on the cause of this?

Thanks in advance

2 Answers, 1 is accepted

Sort by
0
David
Top achievements
Rank 1
answered on 13 Mar 2019, 05:20 PM
This was a rookie mistake... I was not consistent with my variable naming and had a lower case in my ID field when I should have had an upper case.
0
Viktor Tachev
Telerik team
answered on 15 Mar 2019, 11:55 AM
Hello David,

I am glad that the issue is resolved. Thank you for sharing the solution with the community. This can help someone facing similar behavior. 


Regards,
Viktor Tachev
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
David
Top achievements
Rank 1
Answers by
David
Top achievements
Rank 1
Viktor Tachev
Telerik team
Share this question
or