Question

您好我有一个表单，其中有一个按钮用于向我的表单预填充数据库中的数据。使用Json它可以正常填充文本输入，但如何根据我的数据库返回的值选择一个单选按钮？

FORM

<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

<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
        }
    }
    ?>

Answer 1

您目前有两个单选按钮使用相同的ID。 ID应该是唯一的。

您可以使用[name]属性执行此操作，也可以在元素上设置类。这是一个例子：

 $('input[name=q1][value="'+ data.q1 +'"]').prop('checked', true);

Answer 2

您可以根据所述输入的值来执行此操作：

而不是

$('#q1').val(data.q1);

尝试

$('input:radio[value="' + data.q1 + '"]').click();

另一方面，你有两个具有相同ID的无线电，基于id的选择器的结果会因浏览器而异，因为id应该是UNIQUE

Answer 3

您可以参考以下链接来解决您的问题。对我来说很好用

JQuery - how to select dropdown item based on value

Answer 4

不要使用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);
  }

  });

使用Json如何根据数据库中的值选择单选按钮？

4 个答案: