所以我有这个'添加输入字段按钮'代码
<script>
$(document).ready(function() {
var max_fields = 25; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initial text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment
$(wrapper).append('<div><label for="NoTelefon[]">No.Telefon</label><input type="text" name="NoTelefon[]" id="NoTelefon[]" class="required input_field"><a href="#"class="remove_field">Batal</a></div>'); //add input box
}
});
$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
此代码将添加输入字段,也可以删除它。但现在我想添加一个包含数据库数据的下拉框。我已经使用此代码创建了下拉框
<label for="KodDaerah">Daerah</label>
<?php
include('dbase.php');
$sql = "SELECT KodDaerah, NamaDaerah FROM koddaerah";
$result = mysql_query($sql);
echo "<select name='KodDaerah' id='KodDaerah' class='input_field' required /><option></option>";
while($kod = mysql_fetch_array($result)){
echo "<option value=".$kod['KodDaerah'].">" .$kod['NamaDaerah']."</OPTION>";
}
echo "</select>";
?>
<div class="cleaner_h10"></div>
现在,我已将此代码与上述代码结合使用,但添加字段按钮不起作用,任何人都可以提供帮助吗?
这就是我将两个代码组合起来的方法,只需将下拉框中的代码插入arapper.append
<script>
$(document).ready(function() {
var max_fields = 25; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initial text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment
$(wrapper).append('<div><label for="NoTelefon[]">No.Telefon</label><input type="text" name="NoTelefon[]" id="NoTelefon[]" class="required input_field"> <?php $sql = "SELECT KodLokasi, NamaLokasi FROM kodlokasi";$result = mysql_query($sql);echo "<select name='KodLokasi[]' id='KodLokasi[]' class='input_field' required /><option></option>";while($kod = mysql_fetch_array($result)){echo "<option value=".$kod['KodLokasi'].">" .$kod['NamaLokasi']."</OPTION>";}echo "</select>";?><a href="#"class="remove_field">Batal</a></div>'); //add input box
}
});
$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
EDIT -------
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
var max_fields = 25; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initial text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment
$(wrapper).append('<div> <input type="text" name="NoTelefon[]" id="NoTelefon[]" class="required input_field">'+
'<?php
$sql = "SELECT KodLokasi, NamaLokasi FROM kodlokasi";
$result = mysql_query($sql);
echo "<select name=\'KodLokasi[]\' id=\'KodLokasi[]\' class=\'input_field\' required /><option></option>";
while($kod = mysql_fetch_array($result)){
echo "<option value=".$kod['KodLokasi'].">" .$kod['NamaLokasi']. "</OPTION>";
}
echo "</select>";
?>'+
'<a href="#" class="remove_field">Batal</a></div>'); //add input box
}
});
$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
});
});
</script>
答案 0 :(得分:0)
我认为您遇到的主要问题与PHP在JavaScript字符串中放置非转义单引号(用单引号分隔)有关。
注意:您在PHP中用于数据库查询的方法通常被认为已弃用,但我将其保留在此处,以防您的PHP版本仅支持功能查询。
以下是如何编写click()事件追加函数的示例:
$(wrapper).append('<div><label for="NoTelefon[]">No.Telefon</label>'+
'<input type="text" name="NoTelefon[]" id="NoTelefon[]" class="required input_field">'+
'<?php
$sql = "SELECT KodLokasi, NamaLokasi FROM kodlokasi";
$result = mysql_query($sql);
echo "<select name=\'KodLokasi[]\' id=\'KodLokasi[]\' class=\'input_field\' required /><option></option>";
while($kod = mysql_fetch_array($result)){
echo "<option value=\'".$kod['KodLokasi']."\'>" .$kod['NamaLokasi']. "</OPTION>";
}
echo "</select>";
?>'+
'<a href="#" class="remove_field">Batal</a></div>'); //add input box