Uncaught TypeError: Cannot read property 'toString' of undefined

[Mark]

I get the following error when I do this:

function createTaskForm(args){

var category = new ej.dropdowns.DropDownTree({
    placeholder: 'Category',
    floatLabelType: 'Auto',
    change: ddlChanged,
    fields: {
        dataSource: categories,
        value: 'id',
        parentValue: 'category_id',
        text: 'name',
        hasChildren: 'hasChildren'
    }
});
category.appendTo(args.element.querySelector('#category'));

try {
    category.value = args.data.category_id;
} catch (err){
    console.log(err);
}

}

ej2.min.js?id=b27827051c31e64716c7:10 Uncaught TypeError: Cannot read property 'toString' of undefined

    at t.setValidValue (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.setTreeValue (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.updateValue (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.onPropertyChanged (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.e.dataBind (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.dataBind (ej2.min.js?id=b27827051c31e64716c7:10)

    at r (ej2.min.js?id=b27827051c31e64716c7:10)

[Shameer Ali Baig Sulaiman Ali Baig]

Hi Mark, 

 

Greetings from Syncfusion support. 

 

We have checked your reported problem with DropdownTree component. Unfortunately, we were unable to predict the exact cause of your reported problem in your application from your provided details. But, DropdownTree component works correctly without any issues. We have validated your reported problem with a simple sample with DropdownTree. 

 

Please, check that sample below. 

 

Sample: https://stackblitz.com/edit/9rd9an-gjtdg5?file=index.js  

 

 

From your shared code and details, we suspect that your reported issue might have occurred due to parsing undefined variable as string and assigning it as value for DropdownTree. 

 

Supected cause of your reported issue code: 

 

var category = new ej.dropdowns.DropDownTree({
    placeholder: 'Category',
    floatLabelType: 'Auto',
    change: ddlChanged,
    fields: {
        dataSource: categories,
        value: 'id',
        parentValue: 'category_id',
        text: 'name',
        hasChildren: 'hasChildren'
    }
});
category.appendTo(args.element.querySelector('#category')); 

 

try {
    category.value = args.data.category_id;
} catch (err){
    console.log(err);
} 

 

 

If your reported problem still persists, then please (if possible) share us an issue reproducing sample or replicate your issue in the above attached sample and share us more details regarding your issue. 

 

This information would help us to understand your issue and to provide you the prompt solution at the earliest. 

 

Check the followings to know more about DropdownTree component. 

 

Demos: https://ej2.syncfusion.com/javascript/demos/#/material/drop-down-tree/default.html  

 

Documentation: https://ej2.syncfusion.com/javascript/documentation/drop-down-tree/es5-getting-started/  

 

API Reference: https://ej2.syncfusion.com/javascript/documentation/api/drop-down-tree/  

 

Please, get back to us if you need any further assistance. 

 

Regards, 

Shameer Ali Baig S. 

[Mark]

Edit:  I forked your demo: https://stackblitz.com/edit/9rd9an-98r3cd?file=index.js  It will set the value but it doesn't throw an error.

That was my thought as well, so we tried this:

if (typeof args.data.category_id !== 'undefined') {
    category.value = args.data.category_id;
}

But same issue and it gets through the if statement.  If we comment out this line, then the error goes away. I will try casting the value and see if that helps.

Edit:

We updated the code to as follows:

var catVal = args.data.category_id;
if (typeof catVal !== 'undefined') {
    console.log('val is: '+catVal+' val has a type of: '+typeof catVal);
    category.value = catVal;
}

And still get the following:

val is: 19 val has a type of: number

ej2.min.js?id=b27827051c31e64716c7:10 Uncaught TypeError: Cannot read property 'toString' of undefined

    at t.setValidValue (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.setTreeValue (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.updateValue (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.onPropertyChanged (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.e.dataBind (ej2.min.js?id=b27827051c31e64716c7:10)

    at t.dataBind (ej2.min.js?id=b27827051c31e64716c7:10)

    at r (ej2.min.js?id=b27827051c31e64716c7:10)

[Sowmiya Padmanaban]

Hi Mark,  

 

We have checked your reported issue with DropdownTree component. In your shared code snippet, you have assigned value in string type for value property. But the value property accepts only string array as it value, so you need to assign value as string array to value property. 

 

Refer the below code snippet. 

    document.getElementById('go').addEventListener('click',function(){ 

          console.log('val is: '+ddTreeObj.value ); 

          ddTreeObj.value = ['03']; 

          console.log('val is: '+ddTreeObj.value ); 

}); 

Refer the below sample link. 

 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/dropdownTree639066732.zip 

 

Refer the below link to know more about the property of DropdownTree component. 

 

https://ej2.syncfusion.com/javascript/documentation/api/drop-down-tree/#value 

 

Please let us know, if you need any further assistance. 

 

Regards,  

Sowmiya.P 

[Mark]

Yup, that would do it!  Thank you!

[Sowmiya Padmanaban]

Hi Mark,  

  

Most welcome. We are happy to hear that your problem has been resolved. Please contact us, if you need any help from us. 

  

Regards,  

Sowmiya.P