基本上我有三个动态下拉列表和4个普通字段,总共有7个。我是通过使用ajax和javascript来完成的。
第一个显示类别
第二个显示我在第一个下拉列表中选择的类别下的子类别
第三个显示我在第二个下拉列表中选择的子类别下的主题。
然后是正常的输入类型,如性别,职业和工作状态。
此文件名为testdropdown.php
<?php
$con = mysqli_connect("localhost","root","","imetrics");
?>
<form name="form1" action="" method="POST">
<table>
<tr>
<td>Select Category</td>
<td>
<select id="categorydd" name="catdd" onChange="change_category()">
<option>--None Selected--</option>
<?php
$query=mysqli_query($con, "SELECT category_id, categoryname FROM category WHERE ParentCategoryID IS NULL");
while($row=mysqli_fetch_array($query)) {
?>
<option value="<?php echo $row["category_id"]; ?>"><?php echo $row["categoryname"]; ?></option>
<?php
}
?>
</select>
</td>
</tr>
<tr>
<td>Select Subcategory</td>
<td>
<div id="subcategory">
<select>
<option>-- None Selected--</option>
</select>
</div>
</td>
</tr>
<tr>
<td>Select Topic</td>
<td>
<div id="topic">
<select>
<option>-- None Selected--</option>
</select>
</div>
</td>
</tr>
<tr>
<td>Gender</td>
<td><input type="radio" name="age" value="male">Male
<input type="radio" name="age" value="female">Female
<input type="radio" name="age" value="transgender">Transgender
</td>
</tr>
<tr>
<td>Age Gap Allowed:</td>
<td><select name="surveyAgeGroup">
<option value="">--None Selected--</option>
<option value="0 18">Below 18</option>
<option value="18 25">18-25</option>
<option value="26 35">26-35</option>
<option value="36 45">36-45</option>
<option value="46 50">46-50</option>
<option value="51 100">Above 50</option>
</select></td>
</tr>
<tr>
<td>Occupation:</td>
<td><select name="selectOccupation">
<option value="">--None Selected--</option>
<option value="1">Grade School</option>
<option value="2">K-12</option>
<option value="3">College</option>
<option value="4">Working Student</option>
<option value="5">Employed</option>
<option value="6">Unemployed</option>
</select></td>
</tr>
<tr>
<td>Work Status</td>
<td><select name="employed">
<option value="">--None Selected--</option>
<option value="1">Part-time</option>
<option value="2">Full-time</option>
<option value="3">Casual</option>
</select></td>
</tr>
<tr>
<td><input id="btnSaveSurvey" type="submit" name="submit" value="Save Survey">
<input id="btnSaveSurvey" type="submit" name="resetsurvey" value="Reset Survey"></td>
</tr>
</tr>
</table>
</form>
<script type="text/javascript">
function change_category()
{
var xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","ajax.php?category="+document.getElementById("categorydd").value,false);
xmlhttp.send(null);
document.getElementById("subcategory").innerHTML=xmlhttp.responseText;
if(document.getElementById("categorydd").value=="--None Selected--")
{
document.getElementById("topic").innerHTML="<select><option>--None Selected--</option></select>";
}
}
function change_subcategory()
{
var xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","ajax.php?subcategory="+document.getElementById("subcategorydd").value,false);
xmlhttp.send(null);
document.getElementById("topic").innerHTML=xmlhttp.responseText;
}
</script>
这是第二个名为ajax.php的php文件
<?php
$con = mysqli_connect("localhost","root","","imetrics");
$category= isset($_GET["category"])?$_GET["category"]:"" ; $subcat=isset($_GET["subcategory"])?$_GET["subcategory"]:"";
if($category!=""){
$query=mysqli_query($con, "SELECT category_id, categoryname FROM category WHERE ParentCategoryID =$category ");
echo "<select id='subcategorydd' onChange='change_subcategory()'>";
echo " <option>--None Selected--</option>";
while($row=mysqli_fetch_array($query))
{
echo "<option value='$row[category_id]' selected>"; echo $row["categoryname"]; echo "</option>";
}
echo "</select>";
}
if($subcat!=""){
$query=mysqli_query($con, "SELECT * FROM topic WHERE SubCat = $subcat ");
echo "<select>";
echo " <option>--None Selected--</option>";
while($row=mysqli_fetch_array($query))
{
echo "<option value='$row[topic_id]' selected>"; echo $row["title"]; echo "</option>";
}
echo "</select>";
}
?>
在这种情况下,我将如何以及在何处进行插入查询?我有7个领域。