Question

当我选择一名医生时，它会显示日期，然后单击它提供时间值的日期。对我来说还可以，但是问题是，如果我不刷新就更改医生姓名，它将不会隐藏时间值，而只会更改日期。如果医生姓名更改，我想隐藏时间。

在下面，我给出了我的代码。...我认为应该如何解决才能克服此问题

查看代码：

<div class="col-md-12 panel">
    <div class="col-md-3 payment_label"> 
        <label for="exampleInputEmail1">  <?php echo lang('doctor'); ?></label>
    </div>
        <div class="col-md-9"> 
            <select class="form-control m-bot15 js-example-basic-single" name="doctor" id="doctor">  
                <option value="">Select .....</option>
                <?php foreach ($doctors as $doctor) { ?>
                    <option value="<?php echo $doctor->id; ?>"<?php
                    if (!empty($payment->doctor)) {
                        if ($payment->doctor == $doctor->id) {
                            echo 'selected';
                        }
                    }
                    ?>><?php echo $doctor->name; ?> </option>
                        <?php } ?>
            </select>
        </div>
    </div>
    <div class="col-lg-12">
        <div class="col-md-3 payment_label"></div>
        <div class="col-md-3" id="adate"></div>
    </div>
    <div class="col-md-12 panel">
        <div class="col-md-3"></div>
        <div class="col-md-6" id="availabletime" style="margin-bottom: 20px;"></div>
    </div>
</div>

<script>
// doctor availbility date search
    $(document).ready(function(){
        $('#doctor').on('change',function(){
            var doctor_id = $(this).val();
            if (doctor_id == '') {
                $('#adate').prop('disabled',true);
            }
            else{
                $('#adate').prop('disabled',false);
                $.ajax({
                    url:"appointment/fetch_date",
                    type:"POST",
                    data:{'doctor_id':doctor_id},

                    success:function(data){
                        $('#adate').html(data);
                    },
                    error:function(){
                        alert('No Data Found');
                    }
                });
            }
        });

        // doctor availbility time search based on dates
        $(document).on("click", "#_dates" , function() {
            var dates = $(this).val();
            var doctor_id  = $('#doctor').val();

            if (doctor_id == '' && dates == '') {
                $('#availabletime').prop('disabled',true);
            }
            else{
                $('#availabletime').prop('disabled',false);
                $.ajax({
                    url:"appointment/fetch_availableime",
                    type:"POST",
                    data:{dates:dates,doctor_id:doctor_id},

                    success:function(data){
                        $('#availabletime').html(data);
                        /*console.log(data);*/
                    },
                    error:function(){
                        alert('No Data Found');
                    }
                });
            }

        });



    });

</script>

控制代码：

    function fetch_date(){
        $doctor_id = $this->input->post('doctor_id');
        $date = $this->appointment_model->get_stime($doctor_id);
        if (count($date)>0) {
            $pro_select_box = '';
            $pro_select_box .= '  
                       <table class="table table-bordered" style="border:1px solid #333;margin-bottom: 20px;">  
                            <tr>  
                                 <th style="border:1px solid #333; text-align:center">Available Dates</th>      
                            </tr>
                        </table>  
                  ';  
            foreach ($date as $date) {     
                    if($date->date >= date('dd-mm-yyyy')){
                    $pro_select_box .= '
                    <button style="margin-bottom:10px;" class="btn btn-primary" type="button" id="_dates" name="date" value="'.$date->date.'">'
                        .$date->date.
                    '</button>
                    ';
                   }
            }

            echo $pro_select_box;
        }
    }

function fetch_availableime(){
        $doctor_id = $this->input->post('doctor_id');
        $date = $this->input->post('dates');
        $availtime = $this->appointment_model->get_availtime($doctor_id,$date);
        if (count($availtime)>0) {
            $pro_select_box = '';
            foreach ($availtime as $availtime) {
                if(!empty($availtime->avai_time)){
                    $pro_select_box .= '
                        <div class="checkbox" style="font-size: 15px;">  
                          <label class="btn btn-blue" style="margin-bottom: 10px;     line-height: 38px;"><input type="checkbox" name="availtime[]" value="'.$availtime->avai_time.'">'. $availtime->avai_time .'</label>
                          <input type="hidden" name="date" value="'.$availtime->date.'"> 

                        </div> 
                    ';
                } else {
                    $pro_select_box .= '
                        <div style="font-size: 15px;">  
                          <label class="btn btn-blue" style="margin-bottom: 10px;     line-height: 38px;">No data found</label>
                        </div> 
                    ';
                }
            }
            echo $pro_select_box;
        } 

    }

型号代码：

function get_availtime($doctor_id,$date){
    $this->db->select('*');
    $this->db->from('availability');
    $this->db->where('doctor_id',$doctor_id);
    $this->db->where('date',$date);
    $query = $this->db->get();
    return $query->result();
}
function get_stime($doctor_id){
    $this->db->select('*');
    $this->db->from('availability');
    $this->db->where('doctor_id',$doctor_id);
    $this->db->group_by('date');
    $query = $this->db->get();
    return $query->result();
}

Answer 1

如果要隐藏div，请执行以下操作：

success:function(data){
                        $('#adate').html(data);
                        $('#availabletime').hide();
                    },

如果您想再次看到它，则必须show()。

success:function(data){
                        $('#availabletime').html(data).show();
                        /*console.log(data);*/
                    },

尝试克服更改点击事件问题

1 个答案: