I am trying to display two selectboxes in my php page ,where the user can select options from first selectbox to add it to second box and then click a button to generate a textfile with all the options in the second selectbox.
Can anyone please help? (IE 7 only please)
Here is the code that I tried till now.
<html>
<head>
<script language="JavaScript">
function moveSelectedOption() {
// Fetch references to the <select> elements.
var origin = document.getElementById('origin_select');
var target = document.getElementById('target_select');
// Fetch the selected option and clone it.
var option = origin.options[origin.selectedIndex];
//var copy = option.cloneNode(true);
// Add the clone to the target element.
//target.add(copy, null);
target.options[target.options.length] = new Option(option.text, option.value);
}
</script>
</head>
<body>
<div style="position:absolute;top:10px;left:10px;">
<?php
// Make a MySQL Connection
mysql_connect("localhost", "jpro", "pop") or die(mysql_error());
mysql_select_db("db1") or die(mysql_error());
$result = mysql_query("select t1 from results") or die(mysql_error());
?>
<select id="origin_select" style="height:400px;width:200px;" multiple>
<?php
while($row = mysql_fetch_array( $result )) {
$t1 = $row['T1'];
?>
<option value="<?php echo $t1; ?>"><?php echo $t1; ?></option>
<?php
}
?>
</select>
</div>
<script>
$("#btn1").click (functio() {
var arr= new Array;
$("#target_select option").each (function () {
//arr.push( $(this).val() );
alert (this.val());
});
});
</script>
<div style="position:absolute;top:50px;left:220px;">
<button onclick="moveSelectedOption()">Add</button>
</div>
<div style="position:absolute;top:10px;left:300px;">
<select id="target_select" style="height:400px;width:200px;" multiple>
<option> </option>
</select></div>
<div style="position:absolute;top:50px;left:560px;">
<button id="btn1">Generate and Save .txt file</button>
</div>
</body>
</html>