填充选择选项错误Javascript

我正在研究一个学校管理系统，在解决了所有的错误之后，这是一个我似乎无法修复的错误！ 在我的系统中，您可以从下拉列表中选择孩子父亲和母亲的父母，信息正确保存到数据库中，但编辑/查看时会出现问题

关闭第一个孩子的模式并移动到第二个，然后返回到第一个后，父亲和母亲将显示上一个孩子的父母数据

在用ajax填充下拉列表之前，我尝试过清除select/unselecting下拉列表的值，但没有效果。 以下是代码，它仅在您选择childs行上的edit按钮时执行：

$.ajax({
            url: base_url + 'student/fetchStudentData/'+studentId,
            type: 'post',
            cache: false,
            dataType: 'json',
            success:function(response){

                // UNSELECT THE DROP DOWNS TO RESET             
                //$('#editSex').find("option:selected").prop('selected',false);
                //$('#editFatherId').find("option:selected").prop('selected',false);
                //$('#editMotherId').find("option:selected").prop('selected',false);

                $("#editFname").val(response.fname);
                $("#editLname").val(response.lname);
                $("#editDob").val(response.dob);

                // NOW SELECT THE OPTION
                $('#editSex option[value='+ response.sex +']').attr('selected','selected');
                $('#editFatherId option[value='+ response.father_id +']').attr('selected','selected');
                $('#editMotherId option[value='+ response.mother_id +']').attr('selected','selected');

                $("#editAge").val(response.age);
                $("#editContact").val(response.contact);
                $("#editEmail").val(response.email);
                $("#editAddress").val(response.address);
                $("#editCity").val(response.city);
                $("#editCountry").val(response.country);
                $("#editRegisterDate").val(response.register_date);
                $("#editClassName").val(response.class_id);

                $("#editSectionName").load('student/fetchClassSection/'+response.class_id, function(i) {
                    $("#editSectionName").val(response.section_id);
                });             

                $("#student_photo").attr('src', base_url + response.image);

                $("#editClassName").unbind('change').bind('change', function() {
                    var class_id = $(this).val();
                    $("#editSectionName").load('student/fetchClassSection/'+class_id);
                });

HTML和PHP：

        <!-- FATHER -->
        <div class="form-group">
          <label for="editFatherId" class="col-sm-4 control-label">Father</label>
          <div class="col-sm-8">
            <select class="form-control" name="editFatherId" id="editFatherId">
            <option value="">Select</option>
            <?php foreach ($parentsDataMale as $key => $value) { ?>
              <option value="<?php echo $value['parents_id'] ?>"><?php echo $value['fname'] . ' ' . $value['lname'] ?></option>
            <?php } // /forwach ?>
          </select>
          </div>                  
        </div>

        <!-- MOTHER -->
        <div class="form-group">
          <label for="editMotherId" class="col-sm-4 control-label">Mother</label>
          <div class="col-sm-8">
            <select class="form-control" name="editMotherId" id="editMotherId">
            <option value="">Select</option>
            <?php foreach ($parentsDataFemale as $key => $value) { ?>
              <option value="<?php echo $value['parents_id'] ?>"><?php echo $value['fname'] . ' ' . $value['lname'] ?></option>
            <?php } // /forwach ?>
          </select>
          </div>                  
        </div>

发行图片： 第一个孩子：

第二个孩子：

回到第一位：

---

在使用json数据选择一个选项之前，应该取消选择所有选项。否则，您可能会选择多个。。。这很奇怪

此外，请使用布尔属性，而不是使用属性

// NOW SELECT THE OPTION
$('#editSex option').prop('selected',false);
$('#editSex option[value='+ response.sex +']').prop('selected',true);
$('#editFatherId option').prop('selected',false);
$('#editFatherId option[value='+ response.father_id +']').prop('selected',true);
$('#editMotherId option').prop('selected',false);
$('#editMotherId option[value='+ response.mother_id +']').prop('selected',true);

---

在使用json数据选择一个选项之前，应该取消选择所有选项。否则，您可能会选择多个。。。这很奇怪

此外，请使用布尔属性，而不是使用属性

// NOW SELECT THE OPTION
$('#editSex option').prop('selected',false);
$('#editSex option[value='+ response.sex +']').prop('selected',true);
$('#editFatherId option').prop('selected',false);
$('#editFatherId option[value='+ response.father_id +']').prop('selected',true);
$('#editMotherId option').prop('selected',false);
$('#editMotherId option[value='+ response.mother_id +']').prop('selected',true);

而不是使用

 $('#editSex option[value='+ response.sex +']').attr('selected','selected');
 $('#editFatherId option[value='+ response.father_id +']').attr('selected','selected');
 $('#editMotherId option[value='+ response.mother_id +']').attr('selected','selected');

试一试

如果您想使用您已经使用的内容，请尝试使用prop to true

而不是使用

 $('#editSex option[value='+ response.sex +']').attr('selected','selected');
 $('#editFatherId option[value='+ response.father_id +']').attr('selected','selected');
 $('#editMotherId option[value='+ response.mother_id +']').attr('selected','selected');

试一试

如果您想使用您已经使用的内容，请尝试使用prop to true

---

请创建一个问题列表。我已编辑了该问题。谢谢您在哪里填充选择元素，如editSex、editLname和editMotherId？这些元素已经填充了吗？您只是在选择来自数据库的值，还是也在填充它们？这不是MCVE。我们需要完整的重新创建步骤，因此您的HTML等。您添加的代码块只起到了些许帮助。想象一下你的HTML一点帮助都没有请为你的问题创建一个解决方案我已经编辑了这个问题。谢谢您在哪里填充选择元素，如editSex、editLname和editMotherId？这些元素已经填充了吗？您只是在选择来自数据库的值，还是也在填充它们？这不是MCVE。我们需要完整的重新创建步骤，因此您的HTML等。您添加的代码块只起到了些许帮助。想象一下你的HTML一点帮助都没有嘿竖起大拇指你的答案解决了这个问题，它接近我正在做的，谢谢所有的帮助。在你、穆罕默德和利亚姆之间，你解决了我的问题。对不起，在我的问题上没有这么大的帮助！这不是一个容易解释的行为。。。很高兴它起到了作用。嘿，竖起大拇指，你的答案解决了问题，它与我所做的很接近，谢谢你的帮助。在你、穆罕默德和利亚姆之间，你解决了我的问题。对不起，在我的问题上没有这么大的帮助！这不是一个容易解释的行为。。。很高兴这有帮助。