javascript - 如何通过ajax将隐藏字段值传递给codeigniter Controller

Question

我有一个包含按钮(链接)的 View 文件:

<a href id="savebutton" class="btn btn-warning">Save</a>

在此 View 的其他地方，我还在包含我的用户 ID 和空缺 ID 的表单中声明了一些隐藏字段。

echo form_input(dataHiddenArray('userid', $this->auth_user_id));
echo form_input(dataHiddenArray('vacancyid', $vacancydetails[0]->vacancy_id));

这些隐藏字段转化为:

<input type="hidden" value="2" class="userid">
<input type="hidden" value="1" class="vacancyid">

现在我希望能够将这些值发送到我的 Controller (通过 AJAX)，以便我可以将它们插入我的数据库。

我的 JS 文件如下所示:

$(function() {
    var postData = {
        "userid" : $("input.userid").val(),
        "vacancyid" : $("input.vacancyid").val()
    };                                        
        btnSave = $('#savebutton'),
        ajaxOptions = {
            cache: false,
            type: 'POST',
            url: "<?php echo base_url();?>dashboard/vacancy/saveVacancy",
            contentType: 'application/json',
            dataType: 'text'
        };

    btnSave.click(function (ev) {
        var options = $.extend({}, ajaxOptions, {
            //data : $(this).closest('form').serialize()
            data: postData
        });
        ev.preventDefault();

        // ajax done & fail
        $.ajax(options).done(function(data) {
            alert(data);        // plausible [Object object]
            //alert(data[0]);     // plausible data
            console.log(data);  // debug as an object
        }).fail(function (xhr, status, error) {
            console.warn(xhr);
            console.warn(status);
            console.warn(error);
        });
    });

我的 Controller 看起来像这样(它没有做太多，因为它不返回任何东西):

public function saveVacancy() {
        //$this->load->model('user/usersavedvacancies_model');
        /*$data = array(
            'userid' => $this->input->post('userid'),
            'vacancyid'=>$this->input->post('vacancyid')
        );*/
        echo $this->input->post('userid');
    }

Answer 1

对 javascript 的小改动

$(function () {
    var postData = {
        "userid": $("input.userid").val(),
        "vacancyid": $("input.vacancyid").val()
    };
    btnSave = $('#savebutton'),
      ajaxOptions = {
          type: 'POST',
          url: "<?php echo base_url('dashboard/vacancy/saveVacancy);?>",
          dataType: 'json'
      };

    btnSave.click(function (ev) {
        var options = $.extend({}, ajaxOptions, {
            //data : $(this).closest('form').serialize()
            data: postData
        });
        ev.preventDefault();

        // ajax done & fail
        $.ajax(options).done(function (data) {
            console.log(data);  // debug as an object
            if (data.result === 'success') {
                alert("Yeah, it saved userid " + data.userid + " to vacancy id " + data.vacancyid);
            }
        }).fail(function (xhr, status, error) {
            console.warn(xhr);
            console.warn(status);
            console.warn(error);
        });
    });
});

在 Controller 中

public function saveVacancy()
{
    //assigning a more useable object name to the model during load
    $this->load->model('user/usersavedvacancies_model', 'save_vacancy'); 

    $data = array(
        'userid' => $this->input->post('userid'),
        'vacancyid' => $this->input->post('vacancyid')
    );
    //send data to model and model returns true or false for success or failure
    $saved = $this->save_vacancy->doSaveId($data); //yes, I made up the method, change it
    $result = $saved ? "success" : "failed";
    echo json_encode(array('result' => $result, 'userid' => $data['userid'], 'vacancyid' => $data['vacancyid']));
}