PHP CodeIgniter AJAX POST方法不起作用

Question

我已经在模式内部创建了数据输入表单。 在提交按钮上单击时，将调用JS函数，其中数据通过AJAX发布传递到控制器，但未调用我的控制器函数将数据插入到databse中

这是我的模态数据输入表

    <form id="saveEmpForm" method="post">
<div class="modal fade" id="addEmpModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-md" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel" style="text-align: center;font-weight: bold;font-size: 20px;padding-top: 3%;"><span class="fa fa-plus"></span>&nbsp;&nbsp;Add New Expense</h5>
      </div>
      <div class="modal-body">                       
            <div class="form-group row">
                <label class="col-md-3 col-form-label">Expense Type</label>
                <div class="col-md-9">
                    <select name="expense_type" id="expense_type" class="form-control" required="required">
                        <option value="">Choose Expense Type</option>
                        <option value="1">Daily</option>
                        <option value="2">Weekly</option>
                        <option value="3">Monthly</option>
                        <option value="4">Yearly</option>
                    </select>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-md-3 col-form-label">Expense Amount</label>
                <div class="col-md-9">
                  <input type="number" name="expense_amount" id="expense_amount" class="form-control" required="required"> 
                </div>
            </div>
            <div class="form-group row">
                <label class="col-md-3 col-form-label">Description</label>
                <div class="col-md-9">
                  <textarea name="expense_description" id="expense_description" class="form-control" rows="5" required></textarea>
                </div>
            </div>
      </div>
      <div class="modal-footer">
        <center>
        <button style="margin-left: 8%;border: none;" type="submit" id="expense_insert" name="expense_insert" class="btn btn-info btn-sm"><span class="fa fa-plus"></span>&nbsp;&nbsp;<b>Add Expense</b></button>

        <button style="background-color: #252525;color: white;border: none;" type="button" class="btn btn-secondary btn-sm" data-dismiss="modal"><span class="fa fa-window-close" aria-hidden="true"></span>&nbsp;&nbsp;<b>Close Window</b></button>
        </center>
      </div>
    </div>
  </div>
</div>

---

这是我的js功能

$(document).on('submit', '#saveEmpForm', function(event)  
{
    event.preventDefault();

    var expense_type = $('#expense_type').val();
    var expense_amount = $('#expense_amount').val();
    var expense_description = $('#expense_description').val();

    $.ajax({
        url  : "expense/save",
        type : "POST",
        cache : false,
        contentType : false,  
        processData : false,
        dataType: 'JSON',
        context: this,  
        data : {expenseType : expense_type, expenseAmount : expense_amount, expenseDescription : expense_description},
        success: function(data)
        {
            $('#expense_type').val("");
            $('#expense_amount').val("");
            $('#expense_description').val("");
            $('#addEmpModal').modal('hide');
            listExpense();
        }
    });
    return false;
});

---

这是我的控制器功能

public function save()
{
    $add_data = array(              
            //'type' => $this->input->post('expenseType'), 
            //'amount' => $this->input->post('expenseAmount'), 
            //'description' => $this->input->post('expenseDescription'),

            'type' => '1', 
            'amount' => '1200', 
            'description' => 'Testing',
        );

    $data = $this->Expensem->saveExpense($add_data);
    echo json_encode($data);
}   

---

这是我的模型功能

public function saveExpense($add_data)
{
    $result = $this->db->insert('ospos_expense', $add_data);
    return $result;
}

Answer 1

@TaimoorAliZafar您可以尝试像这样序列化表单输入数据。

 $('#saveEmpForm').submit(function(e){ e.preventDefault(); //console.log($('#saveEmpForm').serialize().toString()); $.ajax({ type: "POST", url: "expense/save", cache : false, contentType : false, processData : false, dataType: 'json', context: this, data: $('#saveEmpForm').serialize(), success: function(data){ }, error: function(jqXHR, status, error){ } }); });