Solved

Populating select box from radio button using database data

Posted on 2006-06-18
6
574 Views
Last Modified: 2009-07-29
Hi all,

I've got no problem in how to populate a select box by clicking on a radio button if the javascript array is preprogrammed i.e. the data is already there but my problem is this :

A teaching website. The user selects one of 4 levels (radio buttons) and the select box is populated with the lessons from that level. The option value must contain the id as value and the name of the lesson as the display. The query would be

e.g. select lid,namej from mainlessons where level=1

I'm assuming I have to set 4 arrays using javascript and PHP...any ideas on this one??

Kate
0
Comment
Question by:katneej
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
6 Comments
 
LVL 10

Accepted Solution

by:
0h4crying0utloud earned 250 total points
ID: 16931422


Here is an example with two arrays:

You set up the arrays first, just put PHP varibles where my literals are:

<script>
var optionSet1 = new Array();
optionSet1[0] = createOption("text1", "value1");
optionSet1[1] = createOption("text2", "value2");
optionSet1[2] = createOption("text3", "value3");

var optionSet2 = new Array();
optionSet2[0] = createOption("textA", "valueA");
optionSet2[1] = createOption("textB", "valueB");
optionSet2[2] = createOption("textC", "valueC");



function setOptions(theSelect, optionArray) {
  resetOptions(theSelect);
      for(var i=0; i<optionArray.length; i++) {
        try { theSelect.add(optionArray[i], null); }
    catch(ex) { theSelect.add(optionArray[i]); }
      }
}


function createOption(text, value) {
  var new_option = document.createElement("option");
  new_option.text = text;
      new_option.value = value;
      return new_option;
}

function resetOptions(theSelect) {
  while(theSelect.options.length != 0) {
    theSelect.remove(0);
  }
}

</script>
</head>

<body>
<input type="radio" onclick="setOptions(document.getElementById('select1'), optionSet1)" value="test1">test1<br>
<input type="radio" onclick="setOptions(document.getElementById('select1'), optionSet2)" value="test2">test2<br>
<select id="select1"><option>Default 1</option><option>Default 2</option></select>
</body>
0
 

Author Comment

by:katneej
ID: 16931551
That seems to be moving in the right direction but the trouble is that I need to populate the arrays from a mysql database using the query i provided..
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16931646


I think you need to ask that question in he PHP forum... or wait around for PHP person here....
0
 
LVL 29

Assisted Solution

by:Pravin Asar
Pravin Asar earned 250 total points
ID: 16933641
Here is link to AJAX Based solution to populate select /combobox  (fetching data from databases)

http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_21871187.html

If you like to follow this approach, I can help you further.

0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

Question has a verified solution.

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

This article discusses how to create an extensible mechanism for linked drop downs.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses
Course of the Month10 days, 13 hours left to enroll

631 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