簡體   English   中英

jQuery無法正常運行

[英]jQuery not functioning properly

當我從選擇框中選擇一個值時,我需要在另一個字段上獲取相應的值。這是我的表

     id     first_name  last_name      stud_id      dob         hostel   class  room  bed   status
    175     siraj         k           WPGH00175   01-10-2016      7       28    41    2A    P
    176     nesru         kv          WPGH00176   31-10-2016      7       28    41    2B    P
    177     faizal        ep          WPGH00177   31-10-2016      7       28    41    2C    P
    179     mashoor       uv          WPGH00179   24-10-2016      7       28    41    2D    G

這是我的查看頁面

<div class="form-group" id="stud_id">
          <label for="student" class="col-sm-4 control-label">Student ID</label>
          <div class="col-sm-5">
            <select class="chosen-select chosen-transparent form-control" name="student" id="student">
             <option value="">--Select Student-- </option>
            <?php foreach ($students  as $row) { ?>
              <option value="<?php echo $row->id; ?>"><?php echo $row->stud_id; ?></option>
              <?php }?>
            </select>
          </div>
        </div>
        <div class="form-group">
          <label for="input01" class="col-sm-4 control-label">First Name:</label>
          <div class="col-sm-5" >
            <input type="text" class="form-control" id="first_name1" name="first_name" value="">
          </div>
        </div>

這是我的jQuery

 <script type="text/javascript">
 $(document).ready(function(){

   $('#student').change(function(){ 
      var stud_id=$('#student').val();

      var url='<?php echo base_url(); ?>hostel/ajax_data';

      $.post(url,{s_id:stud_id}, function(data)
          {
        //alert();
             $("#first_name1").html(data);
          });
        });
     });
    </script>

這是我的控制

public function ajax_data()
{
  $stud_id = $_POST['s_id'];
  $data['result'] = $this->admin_model->ajax_name($stud_id);
  $this->load->view('hostel/ajax_data',$data);
}

這是我的模特

public function ajax_name($stud_id)
{
    $query=$this->db->get_where('student_hostel',array('id'=>$stud_id))->row();
    return $query;
}

當我給出val而不是html時,顯示的是我給出的全部。 這是我的看法

<input type="text" class="form-control" id="first_name1" name="first_name" value="<?php echo $result->first_name;?>">

在視圖(hostel / ajax_data)中,您正在打印整個html輸入,並嘗試使用jquery將其再次放入已加載的輸入中,這沒有太大意義。 你只能回聲

<?php echo $result->first_name;?> 

在視圖中或直接在控制器中並使用jquery將此響應放入已加載的輸入中,如下所示:

$("#first_name1").val(data);

如果您需要更多數據,不僅是名字,在這種情況下,您可以制作json。

例:

型號變更:

public function ajax_name($stud_id)
{
    $query=$this->db->get_where('student_hostel',array('id'=>$stud_id))->row_array(); //use row_array instead of row() to return an array
    return $query;
}

控制器變更:

public function ajax_data()
{
  $stud_id = $_POST['s_id'];
  $result = $this->admin_model->ajax_name($stud_id);
  echo json_encode($result); //converting the array to json string and outputting it directly instead of using view
 }

更改jQuery:

<script type="text/javascript">
 $(document).ready(function(){

   $('#student').on("change",function(e){ 
      var stud_id = $(this).val();

      var url='<?php echo base_url('hostel/ajax_data'); ?>';
     $.ajax({
        url: url,
        type: "post",
        data:{s_id: stud_id},
        success: function(result){
            var data = JSON.parse(result); //parsing server response to JSON object
            // Now data is an object. As your query in model is returning all fields, you can also use other fields like in this way: data.last_name, data.dob etc
            $("#first_name1").val(data.first_name);  //updating the input field with retrieved value. This way you also update other fields if necessary
        }
      });

   });
 });
</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM