Solved

changing add array values to option to jquery

Posted on 2013-11-26
2
377 Views
Last Modified: 2013-12-12
I have an old javascript script with a list of an array, and then this script to put the array into the specific select

   for(ctr=0;ctr<Array_Models[num].length;ctr++)
   {
      document.form1.ccf_state.options[ctr]=new Option(Array_Models[num][ctr],Array_Models[num][ctr]);
   }
   

   //Set the length of the select list
   document.form1.ccf_state.length=Array_Models[num].length;

Open in new window


Now I need to switch it over to jquery. I have 2 select boxes on the page that need to be changed and I need to do an each function.
How would I switch the above array to work with this new jquery?

$.each(selectValues, function(key, value) {   
     $('#mySelect')
         .append($("<option></option>")
         .attr("value",key)
         .text(value)); 
});

Open in new window

0
Comment
Question by:rivkamak
2 Comments
 
LVL 44

Assisted Solution

by:Rainer Jeschor
Rainer Jeschor earned 250 total points
ID: 39678129
Hi,
according to your original script, it seems that the value and the text are always the same.

Therefore the following should work:
var selectValues = Array_Models[num];
$.each(selectValues, function( index, value ) {
  $('#mySelect')
         .append($("<option></option>")
         .attr("value",value)
         .text(value)); 
});

Open in new window


Sample:
http://jsfiddle.net/EE_RainerJ/V8Lkf/

HTH
Rainer
0
 
LVL 15

Accepted Solution

by:
Insoftservice earned 250 total points
ID: 39686760
Please copy paste the code and save it as "test.html" and try out

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <title>Love to marry is an free matrimonial website </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="matrimonial, free sms, tourist,hosting">
  <meta name="Description" content="get free advice for your wedding,tourist and holidays package available">
  <script type="text/javascript" src="http://www.lovetomarry.com/media/scripts/jquery-1.4.2.js?v=1"></script>

  <script type="text/javascript">
  $(document).ready(function() {
   var numbers = { "1": "test 1", "2": "test 2" };
        $.each(numbers, function(val, text) {

            $('#items').append(
                $('<option></option>').val(val).html(text)
            );  
			});});
  </script>
 </head>

 <body>
  <select name='items' id='items'>
  </select>
 </body>
</html>

Open in new window

0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…

776 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question