CODEWITHSUNDEEP
javascripthtmlcombobox
bharathi
bharathi

Reputation: 6271

appending the items into the combo box

I need to add the item in a combo box for a particular number of times.This is my code.

         for(i=0;i<3;i++)
    {
         othercompaniesli.innerHTML=  '<select onchange="document.location.href = this.options[this.selectedIndex].value;"><option VALUE="http://www.google.com">'+fStr1[0]+'</option>  </select>';
     }

Here I want to add the fStr1 string 3 times.But it adds only one time.That is the for loop is working but only item value is not appending.Only last value is added in the combo box. Can anyone help me how to append the items into combo box.

Upvotes: 0

Views: 2033

Answers (6)

papaiatis
papaiatis

Reputation: 4291

var select= $('mySelect');
var opt = new Option("OptionTitle", "123");

select.selectedIndex = InsertNewOption(opt, select[0]);

function InsertNewOption(opt, element)
{
    var len = element.options.length;
    element.options[optsLen] = opt;

    return len;
}

Upvotes: 0

Kunal Vashist
Kunal Vashist

Reputation: 2471

What you are doing is the inside the loop you are ending your select tag , so every element will have it own select opening and closing tag. and you are just updating your innerHTML with the newer element thats why its getting the last element.

 var openingTag= '<select onchange="document.location.href = this.options[this.selectedIndex].value;">';

for(i=0;i<3;i++)
{
    openingTag+=  '<option VALUE="http://www.google.com">'+fStr1[0]+'</option>  ';
}

openingTag= '</select>';

othercompaniesli.innerHTML = openingTag;

Upvotes: 0

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

Place select tag out of loop


var selectTag = '<select onchange="document.location.href = this.options[this.selectedIndex].value;">';
for(i=0;i<3;i++) {
 selectTag +=  '<option VALUE="http://www.google.com">'+fStr1[0]+'</option>';  
}
selectTag +="</select>"
othercompaniesli.innerHTML = selectTag;

Upvotes: 0

linuxeasy
linuxeasy

Reputation: 6489

var tmpStr = '<select onchange="document.location.href = this.options[this.selectedIndex].value;">';

for(i=0;i<3;i++)
{
    tmpStr+=  '<option VALUE="http://www.google.com">'+fStr1[0]+'</option>  ';
}

tmpStr = '</select>';

othercompaniesli.innerHTML = tmpStr;

Upvotes: 1

Siva Charan
Siva Charan

Reputation: 18064

Since you are using equal to =, it is re-assigning to the same element

Use append()

$('#othercompaniesli').append('<select onchange="document.location.href = this.options[this.selectedIndex].value;"><option VALUE="http://www.google.com">'+fStr1[0]+'</option>  </select>');

Note that your select and option elements are repeating, you need to change it accordingly.

Upvotes: 0

4b0
4b0

Reputation: 22323

try othercompaniesli.innerHTML +=.

Upvotes: 0

Related Questions