AJAX如何根据数据库更改选择值

时间:2017-06-24 03:44:56

标签: php jquery ajax codeigniter

我正在尝试从数据库更改select的值,但只获得一个返回形式Foreach方法。我不知道这种情况的正确方法。 我想要一个像http://jsfiddle.net/YPsqQ/这样的结果,但数据来自数据库。问题是如何解析要查看的所有数据。不只是一个。也许在Jquery上有些循环?但我不知道该怎么做。 这是代码,我顺便使用Codeigniter。

控制器

public function prodi_pindah()
    {

    if (!$this->login and !$this->admin){
         redirect('akademik/logout');
     }
     else
     {
        $this->load->model('mahasiswa_model');  
        $this->mahasiswa_model->prodi_pindah();
}

查看

<input type="text" name="ptasal" id="ptasal" class="addresspicker" /> // this input has jquery Autocomplete , 
 <input type="hidden" name="id_pt_asal" id="id_pt_asal" /> // this input has ID that sent to model, this ID change whenever ptasal change too
 <select name="id_prodi_asal" id="id_prodi_asal" style="">
<option value="">-- Pilih Program Studi--</option>
</select> 

<script>
        $(document).ready(function(){
    $("#id_prodi_asal").click(function(event){
     var formData = {
            'id_pt_asal': $('input[name=id_pt_asal]').val()
        };
        $.ajax({
            type: 'POST',
            url: '<?=base_url()?>akademik/prodi_pindah',
            data: formData,
            dataType: 'json',
            encode: true
        })    
        .done(function(data) {
            console.log(data);



        if (data.hasil_prodi==true)
            {


            }   

        if (data.hasil_prodi==false)
            {


            }
        })
    event.preventDefault();

    });
});
</script>

模型

public function prodi_pindah()
    {


        $id_pt_asal = $this->input->post('id_pt_asal');

            $kue_prodi = $this->db->query("SELECT
            ps.nama_perguruan_tinggi,
            ps.nama_program_studi,
            ps.`status`,
            rjp.nm_jenj_didik,
            ps.nama_jenjang_pendidikan,
            ps.id_prodi
            from ref_prodi ps
            INNER JOIN ref_jenjang_pendidikan rjp ON ps.id_jenjang_pendidikan=rjp.id_jenj_didik
            WHERE status = 'A' AND id_perguruan_tinggi = '$id_pt_asal'

            ");

        foreach ($kue->result() as $row){
        $value = $row->id_prodi;
        $isi = $row->nama_jenjang_pendidikan.' - '.$row->nama_program_studi;                                 
        $has = '<option value='.$value.'>'.$isi.'</option>';

        }

        $data['html']="<option value=''>-- Pilih Program Studi--</option>$has"; // I want $has had all result, not just one. Here the problem.
        $data['hasil_prodi']=TRUE;
        echo json_encode($data);

    }

3 个答案:

答案 0 :(得分:2)

您可以使用此代码并根据需要进行修改。我使用你的例子制作了这段代码。您只想从PHP函数

动态返回HTML选项列表

//second.js
module.exports.change=function(a){
    a=2;
}
$(document).ready(function(){
    $('#type').on('change',function(){
        var itemId = $(this).val();
        if(itemId){
            $.ajax({
                type:'POST',
                url:'<?=base_url()?>akademik/prodi_pindah',
                 data:'itemId='+itemId,
                success:function(response){
                var html= response.html;
                   html= '<option value="">Select state</option><option value="543">Alger</option><option value="544">Annaba</option><option value="546">Béchar</option><option value="547">Béjaïa</option><option value="545">Batna</option><option value="548">Biskra</option><option value="549">Blida</option><option value="550">Chlef</option><option value="551">Constantine</option><option value="552">Ghardaïa</option><option value="553">Mostaganem</option><option value="554">Oran</option><option value="555">Sétif</option><option value="556">Sidi Bel Abbès</option><option value="557">Skikda</option><option value="558">Tébessa</option><option value="559">Tiaret</option><option value="560">Tlemcen</option>'
                   
                    $('#size').html(html);
                    
                }
            }); 
        }else{
            $('#item').html('<option value="">Select Item first</option>');
            $('#size').html('<option value="">Select Size</option>'); 
        }
    });
    
    
});

答案 1 :(得分:2)

好的,所以你在这里打破了一些MVC规则,这会导致你的困惑。我将在下面澄清。

模型:处理数据库逻辑,许多控制器可以共享一个模型 查看:你的html在哪里(如果你不使用js,可能包括php变量) 控制器:你的php的逻辑在哪里。例如为您的视图映射数组,转到不同的页面等。

我已更改下面的代码,将您的控制器和型号代码放在正确的位置。您的问题还在于您没有将选项字符串添加到上一个选项字符串中。我已经评论过我改变了代码的位置。

控制器

public function prodi_pindah()
{

 if (!$this->login and !$this->admin){
     redirect('akademik/logout');
 }
 else
 {
    $this->load->model('mahasiswa_model');  
    $kue = $this->mahasiswa_model->prodi_pindah();

    //Set the $has variable first so that we can append to it.
    $has = '';
    foreach ($kue as $row){
      $value = $row->id_prodi;
      $isi = $row->nama_jenjang_pendidikan.' - '.$row->nama_program_studi;
      // Now correctly appends $has variable                               
      $has .= '<option value='.$value.'>'.$isi.'</option>';
    }
    // Now correctly adds $has
    $data['html']="<option value=''>-- Pilih Program Studi--</option>" . $has; 
    $data['hasil_prodi']=TRUE;
    echo json_encode($data);
  }
}

模型

public function prodi_pindah()
{
    $id_pt_asal = $this->input->post('id_pt_asal');

    $kue_prodi = $this->db->query("SELECT
      ps.nama_perguruan_tinggi,
      ps.nama_program_studi,
      ps.`status`,
      rjp.nm_jenj_didik,
      ps.nama_jenjang_pendidikan,
      ps.id_prodi
      from ref_prodi ps
      INNER JOIN ref_jenjang_pendidikan rjp ON 
      ps.id_jenjang_pendidikan=rjp.id_jenj_didik
      WHERE status = 'A' AND id_perguruan_tinggi = '$id_pt_asal'
    ")->result();
    return $kue_prodi;
}`

答案 2 :(得分:1)

请详细说明以下解决方案。有了这个,你将学习jQuery中的循环并操作数据从数据库到Html。

  

您的控制器功能如下所示。

public function prodi_pindah() {
    if (!$this->login and ! $this->admin):
        redirect('akademik/logout');
    else:
        $this->load->model('mahasiswa_model');
        $kue = $this->mahasiswa_model->prodi_pindah();
        if ($kue):
            $data['status'] = true;
            $data['records'] = $kue;
        else:
            $data['status'] = false;
        endif;
        echo json_encode($data);
    endif;
}
  

您的模型将如下所示。

public function prodi_pindah()
{
    $id_pt_asal = $this->input->post('id_pt_asal');
    $this->db->select('ps.nama_perguruan_tinggi,ps.nama_program_studi,ps.status,rjp.nm_jenj_didik,ps.nama_jenjang_pendidikan,ps.id_prodi');
    $this->db->from('ref_prodi as ps');
    $this->db->join('ref_jenjang_pendidikan as rjp','ps.id_jenjang_pendidikan = rjp.id_jenj_didik');
    $this->db->where('ps.status','A');
    $this->db->where('ps.id_perguruan_tinggi',$id_pt_asal);
    $query = $this->db->get('ref_prodi as ps');
    return $query->result()
}
  

最后你的观点部分将在下面描述。

$(document).on('#id_pt_asal', 'change', function() {
    var id = $('#id_pt_asal').val();
    $.ajax({
        type: 'POST',
        url: '<?=base_url('akademik/prodi_pindah')?>',
        data: {id_pt_asal: id},
        dataType: "json",
        beforeSend: function() {
            $('#id_prodi_asal')
                    .empty()
                    .append('<option selected="selected">-- Pilih Program Studi--</option>');
        },
        success: function(data) {
            if (data.status) {
                $.each(data.records, function(i, item) {
                    $('#id_prodi_asal').append($('<option>', {
                        value: item.id_prodi,
                        text: item.nama_jenjang_pendidikan + item.nama_program_studi
                    }
                    ));
                });
            } else {
                $('#id_prodi_asal')
                    .empty()
                    .append('<option selected="selected">-- Pilih Program Studi--</option>');
            }
        }
    });
});

所以这是您要求的最终代码。如果它不起作用,请告诉我。