PDA

View Full Version : Dropdown field binding issue



avair
May 30, 2023, 7:19 PM
Below is the javascript function which i am using to bind values to the dropdown using ddlCou.innerText = option.text; only the last option is getting displayed as a label but i need to have a dropdown functionality with select at first and remaining all values which are in result[i]


function loadCountriesDropDown() {
var ddlCou = document.getElementById('ddlCountriesId');
var countyStates = [];
for (var i = 0; i < data.List.length; i++) {
countyStates.push(data.List[i].Name);
}
var result = countyStates.map(function (obj) { return obj.Name; });
result = result.filter(function (v, i) { return result.indexOf(v) == i; });
for (var i = 0; i < result.length; i++) {
var option = document.createElement("option");
option.text = result[i];
ddlCou.innerText = option.text;
}
}


<ext:ComponentColumn runat="server">
<Items>
<ext:DropDownField runat="server" ID="ddlCountriesId" ClientIDMode="Static"></ext:DropDownField>
</Items>
</ext:ComponentColumn>

fabricio.murta
May 30, 2023, 9:29 PM
Hello, @avair!

The DropDownField component is meant to display a complex component as the dropdown box, so it doesn't really handle multiple data, the underlying component "picker" does. Take a look at its overview example: Form > Dropdown Field > Overview (https://examples5.ext.net/#/Form/DropDownField/Overview/)

Perhaps what you need is a read-only combo box? Or a searchable combo box which requires a valid selection from the list of accepted entries? Take a look at this example: Form > Combo Box > Ajax Linked Combos (https://examples5.ext.net/#/Form/ComboBox/Ajax_Linked_Combos/) for it has both examples mentioned, respectively.

Hope this helps!

p.s.: notice it's difficult for us to tell whether your code snippet works or not, how it does, and what to do to make it so. Providing fully runnable test cases allows us to see exactly what you mean and provide more accurate responses. Refer to the following threads for more information:

- Tips for creating simplified code samples (http://forums.ext.net/showthread.php?61176-Tips-for-creating-simplified-code-samples)
- More Information Required (http://forums.ext.net/showthread.php?10205-More-Information-Required)
- Forum Guidelines (http://forums.ext.net/showthread.php?3440-Forum-Guidelines-For-Posting-New-Topics)