Show the value from drop down list

This site is best viewed in a modern browser with JavaScript enabled.

nanie

Hi, I have a form where user need to select a few staff as reviewer. Since I'm still new with javascript, I do not know how to do it.

The situation is user will see one drop down list and need to select a reviewer. Once selected, it will be displayed the name below it. later, another drop downlist will appear and user can select next reviewer. and its continue until the 3rd reviewer. User also can delete those reviewer they select earlier and new drop down list appear..

Is it complicated?? I can't thing any any simpler explanation.

<form action="admin_assignStaff.php" name="selectStaff" id="selectStaff">
<tr>
<td><b>Evaluator</td>			
<td><?php 
                $submissionID = $_GET['subid'];
	        $sql4=oci_parse($conn,"SELECT staffID, COUNT(*) OVER (PARTITION BY subID) FROM submission JOIN evaluation USING (subID) WHERE subID='1'") or die(oci_error());
		$result4=oci_execute($sql4);
		$row4=oci_fetch_array($sql4);
			if($row4['COUNT']==0){
				$sql5=oci_parse($conn,"SELECT * FROM staff WHERE staffID!='".$stfID."' AND staffID!='".$stfID2."'") or die(oci_error());
				$result5=oci_execute($sql5);
				echo '<select name="evaluator" id="evaluator">';
				echo '<option value=" "><---------- Choose Evaluator ---------->';
				while($row5=oci_fetch_array($sql5))
				{
                                        echo '<option value="'.$row5['STFNAME'].'">'.$row5['STFNAME'].'</option>';
				}
                                echo '</select><br /><div id="staff">  </div>';
				}
				else{
					while($row4){
						$stfID3=$row['STAFFID'];
				                $sql3=oci_parse($stfID3,"SELECT stfname FROM staff WHERE staffID='".$stfID2."'") or die(oci_error());
						$result3=oci_execute($sql3);
						$row3=oci_fetch_array($sql3);
						echo $row2['STFNAME']; 
							}
					}
		?></td><tr></table><form>

I put one part of the form where user have to do the selection.

and this is what I have try myself.. It is so simple and of course, doesn't work.

<script>
$(document).ready(function()) {
	$('select').change(function(){
		var value = $(this).val();
		$('#option').show(value);
		});
});
</script>

Please help me..

Padonak

why wouldn't you post html instead of php? and your question is not clear - how those drop downs are related to each other?

root

Try adding to the select onChange="alert(this.options[this.selectedIndex].value);"

as a starting point to move you forward.

Using JQuery is not the answer, its is not JavaScript yet it relies heavily on its use.

 echo '<select name="evaluator" id="evaluator" onChange="alert(this.options[this.selectedIndex].value);">';

Then when your select has a change, the value of what was selected should appear in a pop up alert box.

Accessing a DOM entity is as easy as... document.formName.formElement or in your case document.selectStaff.evaluator then from that you can access the various elements like the .options[] array and the .selectedIndex (which is the reference to the actual selected array element.

See this example code from a select query

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<body>
<script type="text/javascript">
place = {
	Davidson:['Antioch', 'Nashville'],
	Rutherford:['Smyrna', 'LaVergne']
	}

function clearOpts(target){
	sel = document.info[target].options;
	for (i = sel.length - 1; i >= 0; i--)
		sel.remove(i);
}

function configureDropDownLists(o,city) {
	if(document.info[city].options.length!=0) clearOpts(city);
	selected = o.selectedIndex;
	if(selected==0) return;
	city = o.options[selected].value;
	console.log(">" + city);
	for (i = 0; i < place[city].length; i++) {
		createOption('city', place[county.value][i], place[county.value][i]) 
	}

}

function createOption(target, label, value) {
	opts = document.info[target];
	opts.options.add(new Option(label,value) );
}
</script>
    <form name="info">
    <tr>
        <td>County Name: </td>
        <td><select name="county" id="county" onChange="configureDropDownLists(this,'city');">
            <option value=""></option>
            <option value="Davidson">Davidson</option>
            <option value="Rutherford">Rutherford</option>
            </select></td>
    </tr><br>
    <tr>
        <td>City: </td>
        <td><select name="city" id="city">
        </select></td>
    </tr>

   </form>
 </body>
</html>

From that you should be able to find what you need.

nanie

Padonak;1297965 wrote:
why wouldn't you post html instead of php? and your question is not clear - how those drop downs are related to each other?

What do u mean by posting the html when i'm actually trying to fetch the option value from the database?

nanie

While waiting for admin to approve my question, I do more searching. This link http://loudev.com/#home is to give u guys more understanding on what I'm trying to do. It's a bit advance for jquery beginner like me to apply this in my codes. So I need something simpler where user can select value and also remove it.

Padonak

nanie;1298071 wrote:
What do u mean by posting the html when i'm actually trying to fetch the option value from the database?

i meant exactly what i wrote. the fact that you fetch some result from the DB gives us absolutely nothing because we need html to work with. and if you want us to work with your php code you have to post a DB dump file which contains the tables structure and the data to fetch it with php. do you see much of php in the code mr.Slashes posted?

root

So what part of the script I gave a demonstration of don't you understand? It is at its simplest you can ever get.