Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

use php to load html select options

Posted on 2010-09-16
3
Medium Priority
?
651 Views
Last Modified: 2012-05-10
Hello,

I have the below php and html code that works together to build a select control with it's options based on the results from a database query.  The problem I'm facing is that I need to refresh this list without reloading the page.  Currently the php script and the html code is all in one file.  What I want to do is externalize the php script and perform a GET request from javascript to get the list again.  How would I assign the options from the php script (via a GET request) for the select control?

The main reason for this is that within my application I'm removing some options based on some user actions.  I have a need to refresh those options from a javascript function.  Any other ideas?  
<?php
	$con = mysql_connect('localhost', 'user', 'pwd');
	$show_dialog='display:none;';
	if (!$con){
	  die('Could not connect: ' . mysql_error());
	}
	mysql_select_db("db conn string", $con);
	$sql="SELECT * FROM ALBUM_NEW"; 
	$result=mysql_query($sql); 
	$options=""; 
	while ($row=mysql_fetch_array($result)) { 
		$id=$row["ID"]; 
		$title=$row["TITLE"]; 
		$options.="<OPTION VALUE=\"$id\">".$title; 
	} 	
	mysql_close($con);
	echo $options;
?>

<SELECT name="selectAlbum" id="selectAlbum"> 
	<OPTION VALUE="0">-- Choose to Move --</option>
		<?=$options?> 
	</SELECT>

Open in new window

0
Comment
Question by:cgray1223
  • 2
3 Comments
 
LVL 22

Expert Comment

by:Ivo Stoykov
ID: 33689201
Please check the snippets below.

HTH

Ivo Stoykov

var select = document.getElementById("example-select");
select.options[select.options.length] = new Option('Text 1', 'Value1');

or for bunch of data (lets say data is cumming from the server)

var example_array = {
    ValueA : 'Text A',
    ValueB : 'Text B',
    ValueC : 'Text C'
};

var select = document.getElementById("example-select");
for(index in example_array) {
    select.options[select.options.length] = new Option(example_array[index], index);
}

Open in new window

0
 
LVL 22

Accepted Solution

by:
Ivo Stoykov earned 1000 total points
ID: 33689207
here is a full example of add/remove options. Hope it is clear enough.

HTH

Ivo Stoykov

<html>
<body>
<script language="JavaScript">
    function function1() {
        var newOption = document.createElement('<option value="TOYOTA">');
        document.all.mySelect.options.add(newOption);
        newOption.innerText = "Toyota";
    }
    function function2() {
        document.all.mySelect.options.remove(0);
    }
</script>
<select id="mySelect">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>
<input type="button" value="Add" onclick="function1();">
<input type="button" value="Remove" onclick="function2();">
</body>
</html>

Open in new window

0
 
LVL 14

Assisted Solution

by:shobinsun
shobinsun earned 1000 total points
ID: 33689209
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
Suggested Courses

783 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