2013-10-16 34 views
0

我需要做的形式DINAMIC依赖的下拉列表中,所以我发现这个解决方案,使用了JS自动提交功能:如何管理与行动属性附加伤害的表单自动提交

function autoSubmit() 
    { 
     var formObject = document.forms['dados']; 
      formObject.submit(); 
    } 

然后我用在第一个下拉的onchange事件来调用自动提交功能:

<label>Campus:</label> 
<select name="campus" onchange="autoSubmit();"> 
<option VALUE="null"></option> 
<?php 

//Popula a lista com os cursos do DB 

$sql = "SELECT id,nome FROM campus"; 
$countries = mysql_query($sql,$conn); 
while($row = mysql_fetch_array($countries)) 
{ 
if($row[nome]==$campus) 
     echo ("<option VALUE=\"$row[nome]\" selected>$row[nome]</option>"); 
    else 
    echo ("<option VALUE=\"$row[nome]\">$row[nome]</option>"); 
} 

?> 
</select> 

这个元素“校园”将设置好的在第二个下拉SELECT语句中使用:

$campus = $_POST['campus']; 
... 
<label>Curso: 
<span class="small">curso corrente</span> 
</label> 
<select name="curso"> 
<option VALUE="null"></option> 
<?php 

$consulta2 = "SELECT curso FROM campus_cursos WHERE campus = \"" . $campus . "\""; 
$cursoslista = mysql_query($consulta2,$conn); 
while($row = mysql_fetch_array($cursoslista)) 
{ 
    echo ("<option VALUE=\"$row[curso]\">$row[curso]</option>"); 
} 

?> 
</select> 

此代码正在工作,但问题是,这样我就不能在窗体中设置一个动作属性,因为如果我每次第一次下拉更改它时都会重定向到动作的URL。这是可以工作的窗体:

<form name="dados" method="POST" onsubmit="return validar();"> 

没有动作属性附加伤害我不能使用一个提交按钮,所有其他元素的数据发送到正确的URL.there是办法吗?

回答

0

您应该使用Ajax代码填充第二个下拉值。

在窗体的页面:

<label>Campus:</label> 
<select name="campus" id="campus"> 
<option VALUE="null"></option> 
<?php 

//Popula a lista com os cursos do DB 

$sql = "SELECT id,nome FROM campus"; 
$countries = mysql_query($sql,$conn); 
while($row = mysql_fetch_array($countries)) 
{ 
if($row[nome]==$campus) 
     echo ("<option VALUE=\"$row[nome]\" selected>$row[nome]</option>"); 
    else 
    echo ("<option VALUE=\"$row[nome]\">$row[nome]</option>"); 
} 

?> 
</select> 
<label>Curso: 
<span class="small">curso corrente</span> 
</label> 
<select name="curso" id="curso"> 

</select> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$('#campus').change(function(){ 
var campusName = $(this).val(); 
$('#curso').load('generateCurso.php?campus='+campusName); 
}); 
}); 
</script> 

写一个PHP文件,称为generateCurso.php

<?php 
$campus = $_GET['campus']; 

$consulta2 = "SELECT curso FROM campus_cursos WHERE campus = \"" . $campus . "\""; 
$cursoslista = mysql_query($consulta2,$conn); 
?> 
<option VALUE="null"></option> 
<?php 
while($row = mysql_fetch_array($cursoslista)) 
{ 
    echo ("<option VALUE=\"$row[curso]\">$row[curso]</option>"); 
} 

?> 
0

我使用由“on change”事件触发的ajax脚本解决了此问题.ajax脚本调用返回元素数组的外部文件。脚本使用这些元素填充下拉列表。