Question

How can the code below be modified so as to allow a new value to be added to the drop down list, should the specified value not be found in the found in the drop down box?

Right now, I use the given function below to find a given value (option_name) in a drop down box.

I’d like to modify the negative flag (!flag) so as to instead of alerting me that it not has found the option_name, to basically add the new option_name in the existing drop down list.

ie.

get_position( 'drop', 'flower' ) 


<select id="drop" style="width: 200px;">
    <option value="0"></option>
    <option value="1">apples</option>
    <option value="2">oranges</option>
    <option value="3">pears</option>
    <option value="4">mangos</option>
    <option value="5">bananas</option>
    <option value="6">kiwis</option>
</select>

function get_position(id,option_name) {

    var flag = false;

    for ( var i=0; i <= document.getElementById(id).options.length - 1; i++ ) {

        if (document.getElementById(id).options[i].text === option_name)  {

            document.getElementById(id).selectedIndex = i; 
            flag = true;

        }
    }
}

Answer 1

you can use return false if any match found then add the record

   function get_position(id,option_name) {

                var flag = false;
            var length=document.getElementById(id).options.length;
                for ( var i=0; i <= length - 1; i++ ) {

                    if (document.getElementById(id).options[i].text == option_name)  {

                        document.getElementById(id).selectedIndex = i; 
                       return false;
                    } 
           }
              //add item on drop down now 
                document.getElementById(id).options[length] = new Option( txt, length );
                document.getElementById(id).selectedIndex = length;

            }

if you can use Jquery then some thing like this

if($("#id option:contains('option_name')").length ==0)
{

$("#id").append(new Option("option text", "value"));

}