Как отправить пост входных данных AJAX на контроллер?

Question

Я хочу выполнить поиск ввода, используя ajax, я пробовал его, но он все еще не работает. Я думаю, что проблема в том, что значение в ajax не отправляется на контроллер, что приводит к тому, что запрос пропускается, как мне это сделать? решить эту проблему?

Я использую jquery-2.2.3, codeigniter 3

Это Js:

<script>
    $('#boxProfile').hide();
    $("#btnSearch").click(function(){
        var name = $("#inputNameNik").val();
        console.log(name);
        $.ajax({
            url     : '<?php echo base_url('index.php/Search/profile') ?>',
            type    : 'POST',
            data    : { post: name },
            dataType: 'JSON',
            beforeSend: function(e) {
                if(e && e.overrideMimeType) {
                    e.overrideMimeType("application/json;charset=UTF-8");
                }
            },
            success: function(response){
                var html = '';
                var i;
                var no = 1;
                var success = 'Success';
                console.log(success);
                $.each(response, function(index, obj){
                    html += '<div class="box-body box-profile">'+
                                    '<img class="profile-user-img img-circle center" style="width: 160px; height:150px; display: block; margin-left: auto; margin-right: auto;" src="'+obj.foto+'" alt="User profile picture">'+
                                    '<hr>'+
                                    '<h2 class="profile-username text-center">'+obj.name+'</h2>'+
                                    '<p class="text-muted text-center">'+obj.nik+'</p> '+
                                    '<div class="small-box bg-red">'+
                                        '<div class="inner">'+
                                            '<h4 style="text-align:center;">Annual Leave in Year : </h4>'+
                                            '<h4 style="text-align:center;">Annual Leave in Year : </h4>'+
                                            '<h4 style="text-align:center;">Leave in Year : </h4>'+
                                            '<p style="text-align:center;">Balance Leave Now : </p>'+
                                        '</div>'+
                                    '<button type="button" class="small-box btn btn-danger" style="margin:auto;" data-toggle="modal" data-target="#Import" >Click Detail <i class="fa fa-arrow-circle-right"></i></button>'+
                                    '</div>'+
                                '</div>';
                });
                $('#boxProfile').html(html);
                $('#boxProfile').show();
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log(xhr.responseText);
                var fail = 'Fail';
                console.log(fail);
            }
        });
    });
</script>

Это просмотров:

<input type="text" class="form-control" id="inputNameNik" name="nameNik" placeholder="Search Nik / Name">
<span class="input-group-btn">
   <button class="btn btn-default" type="button" id="btnSearch"><i class="fa fa-search"></i></button>
</span>

Это контроллер:

public function profile() {
    $post = $this->input->post('inputNameNik');
    $query = $this->m_data->searchProfile($post);
    echo json_encode($query);
}

Это модель:

public function searchProfile($where){
    $this->db->select('cuti.id_karyawan as cutiIdKaryawan, karyawan.foto, karyawan.nik, karyawan.name, cuti_before.id_karyawan as beforeIdKaryawan, cuti_before.tahun as beforeTahun, cuti_before.sisa_cuti as beforeCuti, cuti.tahun as tahunCuti, cuti.sisa_cuti as cutiSisa, cuti.saldo_cuti as cutiSaldo, tanggal, detail_cuti.keterangan, jmlh_hari, tgl_cuti_dari, tgl_cuti_sampai, cuti.tahun, DATEDIFF(karyawan.tmt_startwork, now()) as start');
    $this->db->from('karyawan');
    $this->db->join('cuti', 'cuti.id = karyawan.id', 'left');
    $this->db->join('cuti_before', 'cuti_before.id_karyawan = karyawan.id', 'left');
    $this->db->join('detail_cuti', 'detail_cuti.id_karyawan = karyawan.id', 'left');
    $this->db->like('karyawan.name', $where, 'both');
    $this->db->or_like('karyawan.nik', $where, 'both');
    $this->db->limit(1);
    $query = $this->db->get();

    return $query->result_array();
}

Answer 1

Исправьте две вещи в вызове ajax

Если вы используете одинарные кавычки ' в начале URL, тогда используйте двойные кавычки внутри.

url     : '<?php echo base_url("index.php/Search/profile") ?>',

Кроме того, используйте одинарные / двойные кавычки для объявления переменной

data    : { 'post': name },

Answer 2

вы передаете post в качестве ключа data: вместо действительного ключа, который является атрибутом имени / идентификатора nameNik / inputNameNik

 var inputNameNik = $("#inputNameNik").val();//changes
        console.log(name);
        $.ajax({
            url     : '<?php echo base_url('index.php/Search/profile') ?>',
            type    : 'POST',
            data    : ({ inputNameNik: inputNameNik }),//changes

в Ajax data : вам нужно передать значения в формате key : value, поэтому в контроллере вы можете использовать ключ для получения значения поста

т.е. если я передам data: ({ nameNik: inputNameNik }),, тогда я буду использовать это в контроллере как $nameNik = $this->input->post('nameNik');поэтому всякий раз, когда вы передаете данные из ajax, будьте внимательны с key, которые вам нужно использовать в вашем контроллере, чтобы получить значение из post

Answer 3

Пожалуйста, удалите эти строки из вашего кода AJAX

dataType: 'JSON',
            beforeSend: function(e) {
                if(e && e.overrideMimeType) {
                    e.overrideMimeType("application/json;charset=UTF-8");
                }
            },

, поэтому при просмотре файла ваш обновленный код будет выглядеть следующим образом:

<script>
    $('#boxProfile').hide();
    $("#btnSearch").click(function(){
        var name = $("#inputNameNik").val();
        console.log(name);
        $.ajax({
            url     : '<?php echo base_url('index.php/Search/profile') ?>',
            type    : 'POST',
            data    : { name: name }, //change
            success: function(response){
                var html = '';
                var i;
                var no = 1;
                var success = 'Success';
                console.log(success);
                $.each(response, function(index, obj){
                    html += '<div class="box-body box-profile">'+
                                    '<img class="profile-user-img img-circle center" style="width: 160px; height:150px; display: block; margin-left: auto; margin-right: auto;" src="'+obj.foto+'" alt="User profile picture">'+
                                    '<hr>'+
                                    '<h2 class="profile-username text-center">'+obj.name+'</h2>'+
                                    '<p class="text-muted text-center">'+obj.nik+'</p> '+
                                    '<div class="small-box bg-red">'+
                                        '<div class="inner">'+
                                            '<h4 style="text-align:center;">Annual Leave in Year : </h4>'+
                                            '<h4 style="text-align:center;">Annual Leave in Year : </h4>'+
                                            '<h4 style="text-align:center;">Leave in Year : </h4>'+
                                            '<p style="text-align:center;">Balance Leave Now : </p>'+
                                        '</div>'+
                                    '<button type="button" class="small-box btn btn-danger" style="margin:auto;" data-toggle="modal" data-target="#Import" >Click Detail <i class="fa fa-arrow-circle-right"></i></button>'+
                                    '</div>'+
                                '</div>';
                });
                $('#boxProfile').html(html);
                $('#boxProfile').show();
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log(xhr.responseText);
                var fail = 'Fail';
                console.log(fail);
            }
        });
    });
</script>

А в Controller, где вы получаете значение формы, используйте следующий код:

public function profile() {
    $post = $this->input->post('name');//it should be same as what you are sending from ajax field
    $query = $this->m_data->searchProfile($post);
    echo json_encode($query);
}

Пожалуйста, дайте мне знать, если это сработает. Спасибо

Answer 4

Когда вы делаете запрос Ajax, вы отправляете post в качестве ключа для имени входа, но в вашем контроллере вы ищете inputNameNik в качестве ключа. Это может быть причиной того, что вы не получаете ввод в контроллере.

Хотя inputNameNik является идентификатором вашего ввода html, PHP не знает об этом имени, все, что у него есть, - это переменная, имя которой вы отправляете через запрос на публикацию.