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

Hi I have a form that has a button used to prefill my form with data from my database. Using Json It works fine to populate text inputs but how do I get it to select a radio button based on the value returned from my database?

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

4个回答



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

您可以使用[name]属性执行此操作,也可以在元素上设置类。 这是一个例子:</ p>

  $('input [name = q1] [value =“'+ data.q1 +'”]')。prop('checked',  true); 
</ code> </ pre>
</ div>

展开原文

原文

You currently have both radio buttons using the same ID. ID's should be unique.

You can use the [name] attribute to do this, or you can set a class on the element. Here is an example:

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



您可以根据所述输入的值来执行此操作:</ p>

而不是</ p >

 <代码> $( '#Q1')VAL(data.q1); 
</代码> </ PRE>

尝试</ p>

  $('input:radio [value =“'+ data.q1 +'”]')。click(); 
</ code> </ pre>

在旁注中,您有两个具有相同ID的无线电,基于ID的选择器的结果将因浏览器而异,因为ID应为UNIQUE </ p>
</ div>

展开原文

原文

You can do it based on the value of said input:

instead of

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

Try

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

On a side note, you have both radios with the same ID, the results of an id based selector are going to vary from browser to browser because an id should be UNIQUE



您可以参考以下链接来解决您的问题。 适用于我</ p>

JQuery - 如何根据值 </ p>
</ div>选择下拉项目

展开原文

原文

you can refer the following link to solve your problem. works fine for me

JQuery - how to select dropdown item based on value

dongye1942
dongye1942 哦,这是一个错误
5 年多之前 回复
doulu8341
doulu8341 除了我们谈论无线电
5 年多之前 回复



不要使用ID,因为两个单选按钮的ID相同</ p>

   done(function(data){

data = JSON.parse(data);
$('#txt1')。val(data.txt1);
$('#txt2')。val(data .txt2);

//不要使用ID,因为id的名称相同
// $('#q1')。val(data.q1);
var $ radios = $(' input:radio [name = q1]');
if($ radios.is(':checked')=== false){
$ radios.filter('[value ='+ data.q1 +']' ).prop('checked',true);
}

});
</ code> </ pre>
</ div>

展开原文

原文

Don't use ID because you have same ID of both radio buttons

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);
  }

  });

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐