populating a drop down menu with xml file

Question

I have the following code which is loading an xml file to populate a dropdown menu. Right now the value equals the option text but I would like to have the value equal to some n

Answer 1

Not sure really what you are asking, but you could do 1 of two things.

Have a count variable in the javascript and everytime you add an option increment this variable. Use that number as the "value" and it will correspond to its "point" in the XML.

Or in the xml do each "make" like this:

<make>
    <id>1</id>
    <name>Ford</name>
</make>

and use the ID.

Not sure what you really want though, so don't know if this will help.

Answer 2

First, start by putting the numbers in your xml file. If they are related to the dropdown item, i suggest as an attribute.

example:

<dropdown>
    <make value="1">Acura</make>
    <make value="4">Aston Martin</make>
    <make value="34">Audi</make>
...
</dropdown>

then in your jquery loop:

$(xml).find('dropdown').each(function(){
     $(this).find('make').each(function(){
          var value = $(this).attr('value');
          var label = $(this).text();
          select.append("<option class='ddindent' value='"+ value +"'>"+label+"</option>");
     });
});

Note that you could probably simplify and speed up your jquery like this (untested):

$('make', xml).each(function(){
              var value = $(this).attr('value');
              var label = $(this).text();
              select.append("<option class='ddindent' value='"+ value +"'>"+label+"</option>");
    });

UPDATE

For another, important, performance boost, do only one append() instead of as many append() as you have "make" nodes.

var optionsHtml = new Array();
    $('make', xml).each(function(){
                  var value = $(this).attr('value');
                  var label = $(this).text();
optionsHtml.push( "<option class='ddindent' value='"+ value +"'>"+label+"</option>");

        });
optionsHtml = optionsHtml.join('');
select.append(optionsHtml);