我如何通过jsonencode数据使用Javascript选择下拉值

How can i make drop down values Selected using Javascript by jsonencode data

本文关键字：选择 Javascript 何通过 jsonencode 数据      更新时间：2023-09-26

在我的html表单中，我有9个下拉值，如果用户操作是Edit，那么它将从数据库中获取值，并以jsonencode格式返回。如下所示，

JSON数据

 [{"ed_gender":"Male","ed_blood_group":"A-","ed_marital_status":"Single","ed_branch_id":"11","ed_desig_id":"1","ed_job_type":"Permanent","ed_pay_mode":"Cheque"}]

HTML

 <select name="ed_gender" class="form-control">
    <option value="">Select</option>
    <option value="Male">Male</option>
    <option value="Female">Female</option>
 </select>
 <select name="ed_marital_status" class="form-control">
    <option value="">Select</option>
    <option value="Single">Single</option>
    <option value="Married">Married</option>
 </select>

我使用php尝试了几行代码，它确实有效，但我正在尝试使用javascript。

PHP

 <select name="ed_marital_status" class="form-control">
    <option value="">Select</option>
    <option <?php if($ed_marital_status=="Single") echo 'selected="selected"'; ?> value="Single">Single</option>
    <option <?php if($ed_marital_status=="Married") echo 'selected="selected"'; ?> value="Married">Married</option>
 </select>

因此，在这里Behave我必须提取json值，并使下拉值在页面加载时具有"Selected"。

编辑：

JSON数据

 [{"ed_branch_id":"11","ed_desig_id":"1"}]

HTML

 <select name="ed_job_location" class="form-control">
     <option value="">Select</option>
      <?php
       foreach($get_branches as $branches){
              $branches_id   = $branches->b_id;
              $branches_name = $branches->b_name; 
              $branches_code = $branches->b_code; 
              echo "<option value='$branches_id||$branches_name||$branches_code'>$branches_name</option>";
       }?>
  </select>
  <select name="ed_desig_id" class="form-control">
      <option value="">Select</option>
      <?php
      foreach($get_designation as $designations){
             $designations_id   = $designations->d_id;
             $designations_name = $designations->d_designation; 
             $designations_code = $designations->d_code; 
             echo "<option value='$designations_id||$designations_code'>$designations_name</option>";
       }?>
   </select>

从上面的json中，我只得到了分支id和desig id，但这里的select选项中有带有||符号的值，所以我需要找到特定的id并在下拉列表中显示它。

遍历json对象的数组，并通过名称选择每个元素值来填充：

var json = [{"ed_gender":"Male","ed_blood_group":"A-","ed_marital_status":"Single","ed_branch_id":"11","ed_desig_id":"1","ed_job_type":"Permanent","ed_pay_mode":"Cheque"}];
$(document).ready(function(){
   $.each(json[0], function(index, element) {
       $("[name="+index + "]").val(element);
   });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="ed_gender" class="form-control">
    <option value="">Select</option>
    <option value="Male">Male</option>
    <option value="Female">Female</option>
 </select>
 <select name="ed_marital_status" class="form-control">
    <option value="">Select</option>
    <option value="Single">Single</option>
    <option value="Married">Married</option>
 </select>

编辑：

只要值在返回的json数据内，就可以显式设置值以覆盖循环外与||串联的分支值的特殊情况：

$(document).ready(function(){
       $("[name=ed_job_location]").val(json[0].branches_id + "||" + json[0].branches_name + "||" + json[0].branches_code);
    });
相关文章：