Binding ASP:dropdownlist with javascript array

Question

0.00/5 (No votes)

See more:

Hi All,

I want to set the asp:dropdownlist's datasource to Javascript array.
Data is fetched in JavaScript and stored in the array. Now I want to Set the dropdownlist DataSource to Javascript Array.

function showResults(results) {
         var resultItems = [];
         var resultCount = results.features.length;
         for (var i = 0; i < resultCount; i++) {
             var featureAttributes = results.features[i].attributes;
             for (var attr in featureAttributes) {
             resultItems.push("" + attr + ":  " + featureAttributes[attr] + "<br>");
           }
           resultItems.push("<br>");
         }
         dom.byId("info").innerHTML = resultItems.join("");

<asp:DropDownList ID="ddlLocation" runat="server">
<asp:ListItem Text="XYZ" Value="XYZi">

What I have tried:

Declared the function in Script and try to bind

Posted 26-Jan-17 23:57pm

Mathan_CodeProject

Updated 27-Jan-17 0:11am

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

José Amílcar Casimiro · Answer 1 · 2017-01-27T00:11:00

Solution 1

You have to do it on the client side.

One way to get the dropdownlist on the client side:

var ddl_location = document.getElementById("<%=ddlLocation.ClientID%>");

Then populate the dropdownlist with array data:

if ddl_location {
    for (var i=0; i < month.length;++i){    
        addOption(ddl_location, some_text_variable, some_value_variable);
    }
}

addOption = function(selectbox, text, value) {
    var optn = document.createElement("OPTION");
    optn.text = text;
    optn.value = value;
    selectbox.options.add(optn);  
}

Posted 27-Jan-17 0:11am

José Amílcar Casimiro

Comments

F-ES Sitecore 27-Jan-17 6:30am

Whilst I agree, I'd add that if you add items via javascript then your server-side control does not know about them and when you do a post-back .net will still think the dropdown is empty. If you want to build a dropdown using javascript then don't use an asp:DropDown, simply use a standard html <select>

A Atique 3-Oct-19 8:37am

I have the same issue in my company's application. There, dropdowns are puplated using JS but when posting back, ASP.NET is taking old dropdown items and not the ones populated by JS, even SelectedValue is old one. Is there any way to let ASP know about these changes?

José Amílcar Casimiro 27-Jan-17 6:31am

Yes, a simple <select> is better in this case.