We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Dropdown selected item show value instead text

Thread ID:

Created:

Updated:

Platform:

Replies:

151076 Jan 30,2020 08:52 AM UTC Jan 31,2020 11:15 AM UTC ASP.NET Core - EJ 2 1
loading
Tags: Dropdown List
Tümer
Asked On January 30, 2020 11:23 AM UTC

I'm using dropdown and it's items are as a treeview. When i selected item on treeview , it shows value instead text in dropdown. What's wrong with it ?

function open() {
if (!isDropDownFilled) {
isDropDownFilled = true;
$.ajax({
type: "GET",
url: "@Url.Action("FillDropDownWithCategories", "Category")", // <-- Where should this point?
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var treeObj;
var dropdownObj = document.getElementById("categoryDropdown").ej2_instances[0];
dropdownObj.popupObj.element.firstElementChild.className = "e-content overflow";
// rendering the treeview only on first time
if (treeObj == null || treeObj == undefined) {
debugger;
treeObj = new ej.navigations.TreeView({
fields: {
dataSource: response.result,
id: 'id',
parentID: 'parentId',
text: 'categoryName',
hasChildren: 'hasChild'
},
// use the nodeselected event to add the text to dropdown's input element.
nodeSelected: function (args) {
dropdownObj.inputElement.text = args.nodeData.text;
dropdownObj.inputElement.value = args.nodeData.id;
}
});
debugger;
treeObj.appendTo('#tree');
}
}
});
}
}

Sureshkumar P [Syncfusion]
Replied On January 31, 2020 11:15 AM UTC

Hi Tümer, 
 
We have checked the shared code snippet.We can able to reproduce the reported issue in our  end. In the nodeSelected event you have updated both text and value. This is the cause of the issue. You don't need to update the text and value property is enough for displaying the selected value. Kindly refer the below code,  
 
function open() { 
    var treeObj; 
    var dropdownObj = document.getElementById("dropdown").ej2_instances[0]; 
    dropdownObj.popupObj.element.firstElementChild.className = "e-content overflow"; 
    // rendering the treeview only on first time 
    if (treeObj == null || treeObj == undefined) { 
        treeObj = new ej.navigations.TreeView({ 
            fields: { dataSource: localData, id: 'id', parentID: 'pid', text: 'name', hasChildren: 'hasChild' }, 
            // use the nodeselected event to add the text to dropdown's input element. 
            nodeSelected: function (args) { 
                var drop = document.getElementById("dropdown").ej2_instances[0]; 
                drop.inputElement.value = args.nodeData.text; 
            } 
        }); 
        treeObj.appendTo('#tree'); 
    } 
} 
 
 
We have created a sample based on your requirement. please find the sample here: https://www.syncfusion.com/downloads/support/directtrac/general/ze/DropdownTree507986507-726308142  
 
Regards, 
Sureshkumar P 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon