Edit - Stack Overflow

You are not logged in. Your edit will be placed in a queue until it is peer reviewed.

We welcome edits that make the post easier to understand and more valuable for readers. Because community members review edits, please try to make the post substantially better than how you found it, for example, by fixing grammar or adding additional resources and hyperlinks.

Required fields*

Rev

Required fields*

Dynamic drop down list using html and php

I'm learning html and php, I have a mysql DB employees where there is a table called Employees_hired, which stores id, name, department and type of contract. I want to make a drop down list of employees who belong to a type of department and a specific contract type. In the code would be something like:

<html> 
<head>
 <title>Dynamic Drop Down List</title>
</head>
<body>
 <form id="form1" name="form1" method="post" action="<?php $_SERVER['PHP_SELF']?>">
 department: 
 <select id="department" name="department" onchange="run()"> <!--Call run() function-->
 <option value="biology">biology</option>
 <option value="chemestry">chemestry</option>
 <option value="physic">physic</option>
 <option value="math">math</option> 
 </select><br><br>
 type_hire: 
 <select id="type_hire" name="type_hire" onchange="run()"> <!--Call run() function-->
 <option value="internal">Intenal</option>
 <option value="external">External</option> 
 </select><br><br>
 list of employees:
 <select name='employees'>
 <option value="">--- Select ---</option>
 <?php
 mysql_connect("localhost","root","");
 mysql_select_db("employees_hired");
 $list=mysql_query("SELECT name FROM usuario WHERE (department ='". $value_of_department_list ."') AND (contrasena ='". $value_of_type_hire."')";);
 while($row_list=mysql_fetch_assoc($list)){
 ?>
 <option value="<?php echo $row_list['name']; ?>">
 <?php if($row_list['name']==$select){ echo $row_list['name']; } ?>
 </option>
 <?php
 }
 ?>
 </select>
 </form> 
</body>
</html>

The question I have is: how to get the selected values from the first drop-down lists (type_hire and department) for use in the query and fill the drop down list of employees. I know how to fill a dropdown list by querying the DB (what I learned in an online course) but I do not know how to take the values from the dropdown lists and use them in my practice. I read that I can use "document.getElementById (" id "). Value" to give that value to the variable in the query, but nowhere explained in detail how. I am new to web programming and my knowledge of Javascript are poor. Can anyone tell me the best way to do this?. It is possible only using html and php or I have to use javascript?

Answer*

So you have the onchange in there and that's a start. The onchange is referencing a JavaScript function that you don't show. There are a couple quick ways to approach this: 

 1. Post the form to itself (as you have chosen) or 
 2. use ajax (possibly via jQuery for quickness). 

*(both of these examples don't address how you are accessing the database)*

**1)** 

Using your run function:

 <script type="text/javascript">
 function run(){
 document.getElementById('form1').submit()
 }
 </script>

Additional PHP:

 <?php
		if (isset($_POST['department']) && isset($_POST['type_hire']))
		{
			$value_of_department_list = $_POST['department'];
			$value_of_type_hire = $_POST['type_hire'];
			
	 mysql_connect("localhost","root","");
	 mysql_select_db("employees_hired");
			mysql_query("SELECT name FROM usuario WHERE (department ='". $value_of_department_list ."') AND (contrasena ='". $value_of_type_hire."')");
			
	 	while($row_list=mysql_fetch_assoc($list))
	 	{
				echo "<option value=\"{$row_list['name']}\">{$row_list['name']}</option>";
			}
		}
		else
		{
			echo "<option>Please choose a department and a type of hire</option>";
		}
 ?>

**2)**

 <script type="text/javascript">
 function run(){
 $.post('get_employees.php',$('form1').serialize(),function(data){
 	 
 	 var html = '';
 	 
 	 $.each(data.employees,function(k,emp){
 	 	 $('select[name="employees"]').append($('<option>', {
 					 value: emp.name,
 					 text: emp.name
 					}));
 	 .html(html);
 },"json");
 }
 </script>

And get_employees.php would contain something like:

 <?php
 if (isset($_POST['department']) && isset($_POST['type_hire']))
 {
 	$value_of_department_list = $_POST['department'];
 	$value_of_type_hire = $_POST['type_hire'];
 	$return = array();
 	
 mysql_connect("localhost","root","");
 mysql_select_db("employees_hired");
 	mysql_query("SELECT name FROM usuario WHERE (department ='". $value_of_department_list ."') AND (contrasena ='". $value_of_type_hire."')");
 	
 	while($row_list=mysql_fetch_assoc($list))
 	{
 		$return[]['name'] = $row_list['name'];
 	}
 	
 	echo json_encode($return);
 }
 ?>

Note, these are just quickly written examples. A lot more could/should be done here.

Draft saved

Draft discarded

Edit Summary*

Cancel

Add a comment |

How to Edit

Correct minor typos or mistakes
Clarify meaning without changing it
Add related resources or links
Always respect the author’s intent
Don’t use edits to reply to the author

How to Format

create code fences with backticks ` or tildes ~
```
like so
```
add language identifier to highlight code
```python
def function(foo):
print(foo)
```
put returns between paragraphs
for linebreak add 2 spaces at end
_italic_ or **bold**
indent code by 4 spaces
backtick escapes `like _so_`
quote by placing > at start of line
to make links (use https whenever possible)

<https://example.com>

[example](https://example.com)

<a href="https://example.com">example</a>

formatting help »
answering help »

How to Tag

A tag is a keyword or label that categorizes your question with other, similar questions. Choose one or more (up to 5) tags that will help answerers to find and interpret your question.

complete the sentence: my question is about...
use tags that describe things or concepts that are essential, not incidental to your question
favor using existing popular tags
read the descriptions that appear below the tag

If your question is primarily about a topic for which you can't find a tag:

combine multiple words into single-words with hyphens (e.g. python-3.x), up to a maximum of 35 characters
creating new tags is a privilege; if you can't yet create a tag you need, then post this question without it, then ask the community to create it for you

popular tags »

default

CollectivesTM on Stack Overflow

Dynamic drop down list using html and php

Answer*