Question 14913 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

how to return kendoDropDownList in jQuery

I had a code like below

let ctrlClassificationLevel = $('#ctrlClassificationLevel').kendoDropDownList();
ctrlClassificationLevel.kendoDropDownList({
    dataTextField: "Name",
    dataValueField: "Id",
    dataSource: data,//data coming from db
    //optionLabel: "User Type",
    filter: "contains",
    suggest: true,
});

now I am trying to create a common code to for kendo dropdownlist as I have multiple Kendo dropdown in my application.

I changed the code to something like below

function BindKendoDropDownListWOCV(kendoDropDownId, textField, valueField, data, optionLabel, filter, suggest, index, value, changeFunction) {
    return kendoDropDownId.kendoDropDownList({
        dataTextField: textField,
        dataValueField: valueField,
        dataSource: data,
        optionLabel: optionLabel,
        filter, filter,
        suggest: suggest,
        index: index,
    });
}

ctrlClassificationLevel = BindKendoDropDownListWOCV(ctrlClassificationLevel, 'Name', 'Id', data, null, 'contains', true, null, null, undefined);

but now when I click on some value of my Kendo DropDownList I get the error -> Uncaught TypeError: Cannot read properties of null (reading ‘Name’)

Tags:

2

Answers


  1. 0

    You need to get a reference to that newly created DropDownList and return that reference – example

    Login or Signup to reply.
  2. 0

    In your return statement, you should return the instance of the DropDownList rather than the result of the kendoDropDownList method.

    And when you pass the kendoDropDownId argument, presumably since the name implies it should just be the id, then only pass the string and then get the DOM in the function.

    Here is an example:

    const BindKendoDropDownListWOCV = (kendoDropDownId, textField, valueField, data, optionLabel, filter, suggest, index, value, changeFunction) => {
    const element = $(kendoDropDownId);
    if (!element) {
        console.error(`Unable to find the DOM by selector: ${kendoDropDownId}`);
        return null;
    }
    return element.kendoDropDownList({
        dataTextField: textField,
        dataValueField: valueField,
        dataSource: data,
        optionLabel: optionLabel,
        filter, filter,
        suggest: suggest,
        index: index,
    }).data('kendoDropDownList');
}
let ctrlClassificationLevel = BindKendoDropDownListWOCV('#ctrlClassificationLevel', 'Name', 'Id', data, null, 'contains', true, null, null, undefined);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search