javascript - 无法在 Ajax 中获得正确的值

Question

我正在做一个医生管理系统。我有三个表单域department，doctor和doctor_time。通过使用 AJAX，我可以按部门获取医生姓名，然后当我进一步选择医生姓名时，我会得到该医生的日期，但如果我再次更改医生姓名，我仍然会得到旧医生的日期。在控制台中，医生的日期数组正确出现，但在 HTML 中datepicker，它不会随着医生的变化而更新。

看法

        <!-- DOCTIRS DEPARTMENT -->
        <div class="col-md-6">
          <div class="form-group">
            <label>DEPARTMENT</label>
            <select class="form-control" id="docdept" name="deptid">
              <option selected value="">SELECT FROM BELOW</option>
              <?php foreach($depts as $dept) : ?>
                <option value="<?php echo $dept['id'] ?>"><?php echo $dept['name'] ?></option>
              <?php endforeach; ?>
            </select>
          </div>
        </div>


      <!-- DEPARTMENT WISE DATA FETCHING OF DOCTOR -->
        <div class="col-6"> 

          <div class="form-group">
           <label>DOCTOR's Name</label>
            <select class="form-control" id="docname" name="doctorid" disabled>
              <option selected disabled>SELECT FROM BELOW</option>
            </select>
          </div>

        </div>
          <!-- DEPARTMENT WISE DOCTOR'S TIME FETCHING -->
           <div class="col-6"> 
            <div class="form-group">
              <label>DOCTOR Timings</label>

              <input type="text" id="doctortime" class="form-control doctortime" placeholder="Doctor Date" name="dates" data-date-format="mm/dd/yyyy" readonly />


          </div>
        </div>

jQuery

$(document).ready(function(){

 // Get The doctor Name department wise
  $('#docdept').on('change',function(){

    var docdept_id = $(this).val();

    // console.log(docdept_id);

      if(docdept_id == ''){
        $('#docname').prop('disabled',true);
        $('#doctortime').prop('readonly',true);
      }else{
        $('#docname').prop('disabled',false);

       // Ajax codeing start
       $.ajax({

           url:'http://localhost/doctor/admin/Bookings_controller/get_docname',
           type:"POST",
           data: {'docdept_id' : docdept_id},
           dataType:'json',
           success:function(data){
             $('#docname').html(data.docbox);
             // $('#doctortime').val(data.doctime);
           },
           error:function(){
             alert('error is there');
           }

       });
      }
  });

  //Get the Time of doctor doctor name wise
    $('#docname').on('change',function(){

      var docname_id = $(this).val();
      console.log(docname_id);

      if(docname_id == ''){
        $('#doctortime').prop('readonly',true);
      }else{
        $('#doctortime').prop('readonly',false);

       // Ajax codeing start
       $.ajax({

           url:"http://localhost/doctor/admin/Bookings_controller/get_doctime",
           type:"POST",
           data: {'docname_id' : docname_id},
           dataType:'json',
           success:function(data){

            // alert(data.doctime);
            // console.log(data.doctime);
            var onlyThisDates = data.doctime.split(",");

            console.log(onlyThisDates);

            $('#doctortime').datepicker({
                format: "mm/dd/yyyy",
                autoclose: true,
                beforeShowDay: function (date) {
                  var dt_ddmmyyyy = ('0' + (date.getMonth() + 1)).slice(-2)  + '/' + ('0' + date.getDate()).slice(-2) + '/' + date.getFullYear();                                     
                  return (onlyThisDates.indexOf(dt_ddmmyyyy) != -1);
                }
            });
           },
           error:function(){
             alert('error is there');
           }

       });   
    }
  });

});

控制器

public function doctor(){
        $data['subview'] = 'admin/doctor_view';
        $data['depts'] = $this->Doctors_model->get_dept();
        $this->load->view('admin_layout',$data);
    }

//Get Doctor name by selecting doctor department
public function get_docname(){
    $docdept_id = $this->input->post('docdept_id');
    $docs = $this->Doctors_model->get_docname_query($docdept_id);
    if(count($docs) > 0){

   // For The Doctor Name Get Department Wise
        $docbox = "";
        $docbox .='<option>Select Doctor from below</option>';
        foreach($docs as $doc){
            $docbox .='<option value="'.$doc['id'].'">'.$doc['name'].'</option>';
        }

        echo json_encode(array('docbox' => $docbox));
    }
}

// Get the times by doctor name wise
public function get_doctime(){

    $docname_id = $this->input->post('docname_id');
    $times = $this->Doctors_model->get_doctime_query($docname_id);
    if(count($times) > 0){

 // For The Doctor Name  Wise Time Get
     $doctime = "";
     $doctime .= $times['dates'];

        echo json_encode(array('doctime' => $doctime));
    }   

}

模型

    //get doctor By department 
    public function get_docname_query($docdept_id){
      $this->db->select('doctors.*,department.id as deptid,department.name as deptname');
      //joining The Department Table
      $this->db->join('department','department.id = doctors.specialisation','left');
      $query = $this->db->get_where('doctors',array('doctors.specialisation' => $docdept_id));
      return $query->result_array();
    }
   //GET DOCTOR TIME
  public function get_doctime_query($docname_id){


    $query= $this->db->get_where('doctors', array('id' => $docname_id));

    return $query->row_array();     
  } 

在数据库中，我有两个表department和doctors. department表有id, name. doctors表有id, doc_name, timing.

我正在使用 Codeigniter 。我可以通过选择科室来获取医生姓名，通过更改科室，医生姓名也会发生变化，但是当我尝试通过选择医生姓名来获取日期时，它会正确显示，但如果我更改医生姓名，我会m 无法查看更改的医生日期。

请让我知道我的代码有什么问题。

标签： javascriptjqueryhtmlajaxcodeigniter

Answer 1

尝试在您的控制器中定义 html 部分，就像您在医生查询时定义的那样。

控制器

public function get_doctime(){

    $docname_id = $this->input->post('docname_id');
    $times = $this->Doctors_model->get_doctime_query($docname_id);
    if(count($times) > 0){

 // For The Doctor Name  Wise Time Get
     $doctime = "";
     // $doctime .= $times['dates'];
     $doctime .= '<label>DOCTOR TIMING</label> <input type="text" id="doctortime" class="form-control" name="dates" placeholder="Select Date" value-data="'.$times['dates'].'" data-date-format="mm/dd/yyyy"/>';

        echo json_encode(array('doctime' => $doctime));
    }   

}

查看dynamic在表单组之后 添加一个类并value-data在输入字段中添加。

 <!-- DEPARTMENT WISE DOCTOR'S TIME FETCHING -->
           <div class="col-6"> 
            <div class="form-group dynamic">
              <label>DOCTOR Timings</label>

              <input type="text" id="doctortime" class="form-control doctortime" placeholder="Doctor Date" value-data="" name="dates" data-date-format="mm/dd/yyyy" readonly />


          </div>
        </div>

jQuery

  //Get the Time of doctor doctor name wise
    $('#docname').on('change ',function(){

      var docname_id = $(this).val();
      console.log(docname_id);

      if(docname_id == ''){
        $('#doctortime').prop('readonly',true);
      }else{
        $('#doctortime').prop('readonly',false);

       // Ajax codeing start
       $.ajax({

           url:"http://localhost/doctor/admin/Bookings_controller/get_doctime",
           type:"POST",
           data: {'docname_id' : docname_id},
           dataType:'json',
           success:function(data){
          //First Transfer the controller value to view
          $('.dynamic').html(data.doctime);

          // Get the value-data from the input field
            var dateval = $('.dynamic input').attr('value-data');
            var onlyThisDates = dateval.split(",");
            $('#doctortime').datepicker({
                format: "mm/dd/yyyy",
                autoclose: true,
                beforeShowDay: function (date) {
                  var dt_ddmmyyyy = ('0' + (date.getMonth() + 1)).slice(-2)  + '/' + ('0' + date.getDate()).slice(-2) + '/' + date.getFullYear();                                     
                  return (onlyThisDates.indexOf(dt_ddmmyyyy) != -1);
                }
            });
            // View Area 

           },
           error:function(){
             alert('error is there');
           }

       });   
    }
  });

这段代码肯定会工作。让我知道。