嗨,我有一个表单,它有一个按钮,用于用数据库中的数据预填充我的表单。 使用 Json 填充文本输入可以正常工作,但是如何让它根据从数据库返回的值选择单选按钮?
形式
<form action="#">
<select id="dropdown-select" name="dropdown-select">
<option value="">-- Select One --</option>
</select>
<button id="submit-id">Prefill Form</button>
<input id="txt1" name="txt1" type="text">
<input id="txt2" name="txt2" type="text">
<input type="radio" id="q1" name="q1" value="4.99" />
<input type="radio" id="q1" name="q1" value="7.99" />
<button id="submit-form" name="Submit-form" type="submit">Submit</button>
</form>
脚本
<script>
$(function(){
$('#submit-id').on('click', function(e){ // Things to do when
.......
.done(function(data) {
data = JSON.parse(data);
$('#txt1').val(data.txt1);
$('#txt2').val(data.txt2);
$('#q1').val(data.q1);
});
});
});
</script>
/tst/orders2.php
<?php
// Create the connection to the database
$con=mysqli_connect("xxx","xxx","xxx","xxx");
........
while ($row = mysqli_fetch_assoc($result))
{
echo json_encode($row);
die(); // assuming there is just one row
}
}
?>
不要使用 ID,因为两个单选按钮的 ID 相同
done(function(data) {
data = JSON.parse(data);
$('#txt1').val(data.txt1);
$('#txt2').val(data.txt2);
// Don't use ID because the name of id is same
// $('#q1').val(data.q1);
var $radios = $('input:radio[name=q1]');
if($radios.is(':checked') === false) {
$radios.filter('[value='+data.q1+']').prop('checked', true);
}
});
您当前有两个单选按钮使用相同的 ID。
可以使用 [name] 属性执行此操作,也可以在元素上设置类。下面是一个示例:
$('input[name=q1][value="'+ data.q1 +'"]').prop('checked', true);
您可以根据
所述输入的值进行操作:
而不是
$('#q1').val(data.q1);
尝试
$('input:radio[value="' + data.q1 + '"]').click();
附带说明一下,您有两个具有相同 ID 的无线电,基于 id 的选择器的结果因浏览器而异,因为 id 应该是唯一的
您可以
参考以下链接来解决您的问题。 对我来说效果很好
JQuery - 如何根据值选择下拉项