[英]JQUERY to auto-populate a select input from another select input
编辑1
我正在从此代码获取CourseID:
$coursesOutput = '<option value=""></option>';
while($row = mysql_fetch_array($result2)){
$courseID = $row['courseID'];
$courseName = $row['name'];
$coursesOutput .= '<option value="' . $courseID . '">' . $courseName . '</option>';
}
我的PHP脚本如下(返回一个echo语句)
<?php
include ("includes/connect.php");
$courseID = mysql_real_escape_string($_GET['courseID']);
$sql = "SELECT tee1, tee2, tee3, tee4, tee5 FROM courses WHERE courseID='$courseID' LIMIT 1";
$result = mysql_query($sql) or die(mysql_error());
while($row = mysql_fetch_array($result)){
$tee1 = $row['tee1'];
$tee2 = $row['tee2'];
$tee3 = $row['tee3'];
$tee4 = $row['tee4'];
$tee5 = $row['tee5'];
}
$teesOutput = '<option value="' . $tee1 . '">' . $tee1 . '</option>';
if($tee2 != ""){
$teesOutput .= '<option value="' . $tee2 . '">' . $tee2 . '</option>';
}
if($tee3 != ""){
$teesOutput .= '<option value="' . $tee3 . '">' . $tee3 . '</option>';
}
if($tee4 != ""){
$teesOutput .= '<option value="' . $tee4 . '">' . $tee4 . '</option>';
}
if($tee5 != ""){
$teesOutput .= '<option value="' . $tee5 . '">' . $tee5 . '</option>';
}
echo '' . $teesOutput . '';
die();
?>
我没有收到任何Ajax错误,但在T型选择器中仍然没有任何填充。 希望这会有所帮助,我再一次被这里的支持所淹没,难以置信!
结束编辑1
我暂时无法弄清楚这个AJAX-JQUERY功能。 对于优秀的jQuery程序员来说,这应该是个容易的地方。
我希望能够在用户选择课程后自动填充我的T型选择输入。 这是一个高尔夫应用程序,球场有几种不同的发球区配色方案,因此每种方案都是特定于球场的。
到目前为止,我的损坏代码是:
的HTML
<form id="formAddScore" action="addscore.php" enctype="multipart/form-data" method="post">
<p class="profile_label">Select Date:</p>
<input type="text" id="datepicker" name="datepicker" class="score_input" />
<p class="profile_label">Select Course:</p>
<select id="course" name="course" class="score_input" onchange="populateTee(this.value)">
' . $coursesOutput . '
</select>
<p class="profile_label">Select Tee:</p>
<select id="tee" name="tee" class="score_input">
</select>
<p class="profile_label">Actual Score:</p>
<input id="score" name="score" class="score_input" type="text" size="10" />
<p class="profile_label">Score ESC (Equitable Stroke Control):</p>
<input id="scoreESC" name="scoreESC" class="score_input" type="text" size="10" />
<br/>
<input id="btnAddScore" name="btnAddScore" class="btn_score" type="submit" value="Add Score" />
</form>
JQUERY
function populateTee(courseID)
{
$.ajax(
{
url: 'includes/populate_tee.php?courseID=' + courseID,
success: function(data) {
$("#tee").html(data);
}
});
}
的PHP
populate_tee.php脚本起作用,所以我不会浪费您的时间。
我相当确定问题出在上述JQUERY-AJAX脚本中。
任何帮助都会很棒。
提前致谢。
courseID来自哪里? 尝试将其登录到控制台。 这有帮助吗?
function populateTee(courseID){
$.ajax({
url: 'includes/populate_tee.php?courseID=' + courseID,
success: function(data) {
//Assuming you're returning the tees list as an indexed array
var ops = '';
for(var i=0; i<data.length; i++){
ops += '<option>'+data[i]+'</option>';
}
$("#tee").html(ops);
}
});
}
我建议不要使用jquery .change()方法,而不是在select上使用onChange事件。 试试下面的代码应该可以解决问题。
$('#course').on('change', function () {
var courseID = $(this).val();
$.ajax({
type: "post",
url: 'includes/populate_tee.php?courseID=' + courseID,
success: function(data) {
$("#tee").html(data);
}
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.