I'm currently a beginner in javascript and i'm having a hard time passing the value of a dropdown box. I only know how to get the value into php if I wrap the select stuff into a post form and create a button to get the values when it's clicked but since this is javascript there isn't a submit button and I need to update the second dropdown list based on the value of the first dropdown list and update the third dropdown list based on the first and second values.
My table looks like this:
Currently, what my code does is it only stores the values inside the dropdown boxes. What I wanted it to do is if "guy" chooses January and chooses week 1, year should only contain 2015 and when he chooses week 2, year should only contain 2013.
<?php
mysql_connect("localhost","root","") or die(mysql_error());
mysql_select_db("my_db") or die (mysql_error());
$queryMonth = mysql_query("SELECT DISTINCT month FROM list WHERE username='guy'");
$queryWeek = mysql_query("SELECT DISTINCT week FROM list WHERE username='guy', month='Should be the value of the first select'");
$queryYear = mysql_query("SELECT DISTINCT year FROM list WHERE username='guy', month='Should be the value of the first select', week='Should be the value of the second select'");
?>
<html>
<head>
<script src="js/javascript.js"></script>
<script>
function getMonth() {
document.getElementById("monthchoice").value = document.getElementById("month").value;
}
function getWeek() {
document.getElementById("weekchoice").value = document.getElementById("week").value;
}
function getYear() {
document.getElementById("yearchoice").value = document.getElementById("year").value;
}
</script>
</head>
<body>
<select id="month" onchange="getMonth()" >
<option value="" disabled selected>Select your option</option>
<?php
while($getMonth = mysql_fetch_assoc($queryMonth))
{
echo
'
<option value="'.$getMonth['month'].'">'.$getMonth['month'].'</option>
';
}
?>
</select>
<select id="week" onchange="getWeek()" >
<option value="" disabled selected>Select your option</option>
<?php
while($getWeek = mysql_fetch_assoc($queryWeek))
{
echo
'
<option value="'.$getWeek['week'].'">'.$getWeek['week'].'</option>
';
}
?>
</select>
<select id="year" onchange="getYear()" >
<option value="" disabled selected>Select your option</option>
<?php
while($getYear = mysql_fetch_assoc($queryYear))
{
echo
'
<option value="'.$getYear['year'].'">'.$getYear['year'].'</option>
';
}
?>
</select>
<br><br>
<input type="text" id="monthchoice"><br>
<input type="text" id="weekchoice"><br>
<input type="text" id="yearchoice"><br>
</body>
</html>
You should research for ajax.
http://www.w3schools.com/ajax/ajax_intro.asp
When your dropdownboxvalue's value is changed. You can use ajax to request new data from the server. The server should return json datatype or xml if you want. Then you parse the data you receive from server into javascript object. Then use javascript to replace the old dropdownboxvalue value into new dropdownboxvalue you receive from the server before (i recommend u use jquery because it is quiet easy to use for beginner)