I got 3 input fields and each field are getting their data from its own tables called Tour type, country and destination respectively as shown
<label>Tour Type</label>
<select id="element_11" name="element_11" required>
<option value="" selected="selected">--Select--</option>
<?php
while($row=mysql_fetch_array($sql))
{
$tour_type_id=$row['tour_type_id'];
$name=$row['tour_name'];
echo "<option value='$tour_type_id'>$name</option>";
}
?>
</select>
<label>Country</label>
<select id="element_12" name="element_12" required>
<option value="" selected="selected">-- Select --</option>
<?php
$sql=mysql_query("Select countries_id,countries_name from countries");
while($row=mysql_fetch_array($sql))
{
$cid=$row['countries_id'];
$name=$row['countries_name'];
echo "<option value='$cid'>".$name."</option>";
}
?>
</select>
<label>Destination</label>
<select id="element_13" name="element_13" required>
<option value="" selected="selected">-- Select --</option>
<?php
$sql=mysql_query("Select destination_id,destination_name from destination");
while($row=mysql_fetch_array($sql))
{
$destination_id=$row['destination_id'];
$name=$row['destination_name'];
echo "<option value='$destination_id'>".$name."</option>";
}
?>
</select>
</div>
</li>
This is what i got as my 3 database tables i.e. tourtype, countries and destination respectively:
I am trying to make each field dependent on each other more like a dependent drop down box. For example if i select a tour type then the 2nd drop down should populate options only relevant to what is selected from the 1st drop down and so on. In this case for e.g if i select culture ,then the 2nd drop down should only show amsterdam and belgium.
Can anyone help me on this.
Please go through this link dependent dropdown using jquery ajax
How he maintained the relations among the entities
let me explain you if you want countries based on tour then you need to relate the country table with tour table as you have shown the country table in image it contains only two columns countries_id and countries_name you have to add one more column that is tour_type_id when you select any tour you will get the tour_type_id then your query should be
SELECT * FROM `countries` where `tour_type_id` = 1 //this is the id you will get from the tour_type select box
and this will populate the related countries same case for the destination related this table with country_id
Hope it makes sense
as i am an asp.net developer i can suggest you put your 2nd and 3rd drop down in an update panel(ajax update panels) then in your 2nd drop down query make it like $sql=mysql_query("Select countries_id,countries_name from countries where tour_type_id="+element_11.SelectedItem.Value+""); it will select those values whose tour_type_id is same as you selected in first drop down, same logic can be use in 3rd drop down as well
There are two ways to sole this.. you can use use php with a page refresh and 2nd way use jQuery ajax to populate fields accordingly.
Related
I'm making a website in HTML and PHP.
I want to make a dropdown menu using select and also have an input field as well.
Basically I have a mysql database.
Say a table in it is called Project, with columns ID, Name, Budget, Start_date.
I want a dropdown menu that allows me to select the columns: ID, Name, Budget, Start_date.
After the column is selected, I want to be able to input a value (also might be nice if I can specify number vs text for each different column for input type)
<form action="somepage.php" method="GET">
ID: <input type="text" name="Pid" /><br><br>
And then on somepage.php, I will be doing this:
$myvariable = $_GET['Pid'];
$sql = "INSERT INTO Project(ID)
VALUES('$myvariable' ";
I know how to do all this with multiple input fields with one submit button.
But I want to know how to do this with SELECT dropdown.
Is there some way to tell on the somepage.php what dropdown element was selected?
Because I need to know which column in Table Project that $myvar is supposed to be inserted into.
Thanks!
You can check by name if something was selected in select. Same as input text. I'm giving you an example here, not mentioning that you need to work on security against SQL injection, that is some other topic.
<form action="somepage.php" method="GET">
<select name="first">
<option value="-1" selected>Select something...</select>
<option value="first_chice">First choice</select>
</select>
<select name="second">
<option value="-1" selected>Select something else ...</select>
<option value="first_chice">Other First choice</select>
</select>
</form>
<?php
//somepage.php
if(isset($_GET['first']) && ($_GET['first'] != "-1")) {
//You have a selection in first select box
echo $_GET['first'];
}
if(isset($_GET['second']) && ($_GET['second'] != "-1")) {
//You have a selection in first select box
echo $_GET['second'];
}
?>
include('connection.php');
$con=mysql_query("select * from province"); ?>
<select name="pid" style="float:left; width:135px;">
<option value="">Select Country</option>
<?php while($row=mysql_fetch_array($con)) {
$pid=$row['province_id'];
?>
<option value="<?=$pid?>" ><?php echo $row['province_name'] ?>
</option>
<?php } ?>
</select> -
<?php
$pid=$_POST['$pid'];
include('connection.php');
$con=mysql_query("select * from city where city_state ='$pid' ") or die(mysql_error()); ?>
<select name="cid" style="float:left; width:135px;">
<option value="">Select City</option>
<?php while($row=mysql_fetch_array($con)) {
$cid=$row['city_id'];
?>
<option value="<?=$cid?>" ><?php echo $row['city_name'] ?> <?php }?>
</option>
</select>
first table is country table, that coutry id is province_id,
second table is city, that Province id is city_state,
so, post value one to another dropdown
For this, you could use AJAX. In your country dropdown box, just echo all the countries in <option> elements.
Then attach a change event on this dropdown box using jQuery, so that it will take the user's input (I mean selected country) and do an AJAX request(jQuery has various shorthand methods for AJAX too) to fetch all the provinces belonging to this country. So this request will be sent to a PHP page on your site, that will pull the details from your db using the country id that the user selected.
Then the result from the AJAX request, which would be list of provinces with their IDs is dynamically appended to the second dropdown box(ie. for province). And for this province dropdown box also you would attach a change event to it, and do the similar thing like I mentioned above to fetch all the cities under this province, using AJAX.
Do a quick research on AJAX, in Google. There are lots of tutorials to help you.
i need to populate another drop down based on previous selected drop down. please help.My code is below. Now, how i pass the previous selected value to next dropdown where clause?
<td align="right">Country</td>
<td>
<select type="text" name="Country">
<option selected value="">Country Code</option>
<?php $result=mysql_query("SELECT CountryName FROM tbl_country");
while($row_result=mysql_fetch_row($result))
{ echo "<option value=\"$row_result[0]\">$row_result[1]</option>";}
?>
</select>*
</td>
<td align="right">Area</td>
<td>
<select type="text" name="Area">
<option selected value="">Area</option>
<?php $result=mysql_query("select Area from tbl_area where CountryName='???'");
while($row_result=mysql_fetch_row($result))
{ echo "<option value=\"$row_result[0]\">$row_result[0]</option>";}
?>
</select>*
</td>
How can i set the selected country name into the second queries where clause?
Thanks in advance.
As PHP is run on the server you will need to request the server to run the second query for you by either having the page refresh or do it via AJAX so that the page refreshes but without looking like it has.
The easiest solution would be to do it across 2 pages, if you want to do it on the one then AJAX is the way forward.
Give me a minute and i'll look for an example.
I have two tables one tblEmployee and another tblCity.
The two tables are setup like this:
tblEmployee
-------------
employeeID
cityID
name
sex
contactNo
tblCity
-------------
cityID
cityName
I would like to create a form whereby an admin can update an employee's details. The form has a drop down box which is populated by the cityNames in tblCity.
I am struggling coming up with a query to allow the admin to select one of these cities from the drop down which will update the employee's cityID to the corresponding city in tblCity.
Many thanks in advance!
I suspect what you want is to setup the select values like this:
<option value="cityID">cityName</option>
The cityID will be submitted, and then you put that value in the tblEmployee.cityID.
For example:
<p>
<select id="sel1">
<option value="001">Auburn</option>
<option value="002">Austin</option>
<option value="003" selected>Dallas</option>
<option value="004">Houston</option>
</select>
<button rel="sel1">Show selected value (with value attribute)</button>
</p>
<p>
<select id="sel2">
<option>Auburn</option>
<option>Austin</option>
<option selected>Dallas</option>
<option>Houston</option>
</select>
<button rel="sel2">Show selected value (no value attribute)</button>
</p>
$('button').click(function(){
var $sel = $('#' + $(this).attr('rel')).find('option:selected');
console.log($sel.val() + ' - ' + $sel.text());
});
http://jsfiddle.net/5McA9/1/
Disclaimer: It's been a while since I last wrote any code. The quality of my code is likely to be sub-par. You've been warned.
Greetings.
I am coding a basic form that uses a SELECT list I populate from my database.
However, my user needs the form to be dynamic and wants to be able to select either MasterTable1 or MasterTable2 or MasterTable3...
Instead of hardcoding the table name for the database query that populates the SELECT list, I attempted to implement a basic Ajax action (used example from w3schools)...and that's when I lost my sanity...
I can output <div id='txtHint'></div> in my page and it shows the correct table name that was picked.
But how do I pass the correct table name to my query that will populate my SELECT list???
I tried
<select name="DBFilename" id="DBFilename" size="0">
<option value="">Select Filename</option>
<?php
$sql="select distinct filename from "."<div id='txtHint'></div>";
$result = mysql_query($sql);
while ($row = mysql_fetch_array($result)){ ?>
<option value="<?php echo $row['filename']; ?>"><?php echo $row['filename']; ?></option>
<?php } ?>
</select>
But to no avail. This is confusing since I can do this...
...
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","gettable.php?q="+str,true);
xmlhttp.send();
}
</script></head>
<body><form><select name="SrcTbl" id="SrcTbl" size="0" onchange="showTable(this.value)">
<option value="">Select Data Table</option>
<option value=""> </option>
<option value="MasterTable1">up to 31 days old</option>
<option value="MasterTable2">62 days old</option>
</select>
</form><br /><div id="txtHint"><select name="tabList"><option></option></select> </div>
</body></html>
And the name of my table will be displayed in the SELECT list 'tablist'.
How do I pass the correct table name to my query that will populate my SELECT list? Thanks!!
(Pastebin =>form code)
m8, ajax is mainly used for user experience and populating a select list is so easy mode that it shouldnt be bothered with ajax in the first place!
You should use ajax if you want to use some methods on user submitted data and create an illusion of seamless data exchange between the server and the client, and based on the return results render a corresponding view or an element of the view.
unless you load every element of the view with ajax, you should populate your html with php from the start!
<select name="DBFilename" id="DBFilename" size="whatever since style belongs to css">
<option selected="selected">Select Filename</option>
<?php
$sql="SELECT DISTINCT filename from 'wherever'";
$result = mysql_query($sql);
while ($row = mysql_fetch_array($result)){ ?>
<option value="<?php echo $row['filename']; ?>"><?php echo $row['filename'];?>
</option>
<?php } ?>
</select>
Create a separate php script which returns a list of select options -> values depending on the table name given to it. You must remember to protect against sql injection. Then use ajax to retrieve the list and insert it into the select.