План
У меня есть план использования JQUERY для получения ввода из трех полей внутри представления. Затем используйте AJAX для отправки этого входа в контроллер, который, в свою очередь, отправляет эти данные модели. Чтобы использовать для извлечения данных, отправьте результат обратно в .js-файл, а затем измените таблицу, чтобы отобразить данные внутри представления.
Проблема
Просматривая мой код, это не похоже на то, что данные не отправляются из файла .js в контроллер. Я думаю, это потому, что данные из базы данных не отображаются внутри измененной таблицы. Кроме того, когда я помещаю эхо внутри контроллера, чтобы отправить его обратно в .js, чтобы вызвать предупреждение, чтобы увидеть, был ли AJAX успешным. Ничего не произошло.
Мой Javascript Code
$('#bttnSubmit').click(function() { // Gather the input from the view and place them into variables var company = $('#client :selected').val(); var dateFrom = $('#dateFrom').val(); var dateTo = $('#dateTo').val(); if (company != "") { var post_url = "http://localhost/ProjectSage/index.php/site/members_area"; $.ajax ({ type: "POST", url: post_url, cache: false, data: "company=" + company + "&dateFrom=" + dateFrom + "&dateTo=" + dateTo, success: function(invoices) { $.each(invoices, function(InvoiceID, CompanyName, InvRef, InvDate, InvTotal, SageReference){ $('.invoice_tbody').append('<tr>'); $('.invoice_tbody').append('<td class="invoice_td">' + InvoiceID + '</td>'); $('.invoice_tbody').append('<td class="invoice_td">' + CompanyName + '</td>'); $('.invoice_tbody').append('<td class="invoice_td">' + InvRef + '</td>'); $('.invoice_tbody').append('<td class="invoice_td">' + InvDate + '</td>'); $('.invoice_tbody').append('<td class="invoice_td">' + InvTotal + '</td>'); $('.invoice_tbody').append('<td class="invoice_td">' + SageReference + '</td>'); $('.invoice_tbody').append('</tr>'); }); } // End of success }) // End of AJAX method } else { alert("You need to select an input first!!!"); } // End of if statement }); // End of click function
Код моей контрольной функции
function get_invoices() { // Retrieve the data sent from the .js file using _POST method $company = $_POST['company']; $dateFrom = $_POST['dateFrom']; $dateTo = $_POST['dateTo']; // Load invoice_model // Initialise the JSON header // Encode the response using the parameters sent from the .js file and send it back to the .js file $this->load->model('invoice_model'); header('Content-Type: application/x-json; charset=utf-8'); echo(json_encode($this->invoice_model->get_invoices($company, $dateFrom, $dateTo))); }
Код моей модели
function get_invoices($company, $dateFrom, $dateTo) { // Query to retrieve data from database // Sent it back to the controller to be populated into a table $ONEDB = $this->load->database('ONEDB', TRUE); $ONEDB->select('InvoiceID, CompanyName, InvRef, InvDate, InvTotal, SageReference'); $ONEDB->where('ClientID', $company); $ONEDB->where('InvDate >=', $dateFrom); $ONEDB->where('InvDate <=', $dateTo); $ONEDB->join('Supplier', 'Supplier.SupplierName = InvDetail.InvSupplier'); $query = $ONEDB->get('InvDetail'); $result = $query->result(); return $result; }
Вопрос
Кто-нибудь знает, где я поступил не так, и какое исправление для моей проблемы?
благодаря
хорошо, давайте начнем с нуля. 1) На вашем JS поместите предупреждение после:
var company = $('#client :selected').val(); var dateFrom = $('#dateFrom').val(); var dateTo = $('#dateTo').val(); ALERT(company, dateFrom, dateTo );
см., если переменные имеют данные. Если да, продолжайте. 2) проверьте URL. вставьте свой url в браузер и посмотрите, действительно ли контроллер вызывается. если это не так, исправьте этот url.
3) измените ваш вызов ajax на jquery, его проще. Также добавьте предупреждение в свой код успеха.
var url = "http://..."; var dataToSend= {company: company, dateFrom: dateFrom.....}; $.post(url, dataToSend, function(data) { ALERT(data); });
4) на контроллере PHP, проверьте, принимаются ли данные так:
function get_invoices() { $company = $this->input->post('company'); $dateFrom= $this->input->post('dateFrom'); $dateTo= $this->input->post('dateTo'); echo $company; echo $dateFrom; echo $dateTo; }
5) что вы получаете?
Вы должны определить функцию error
в $.ajax
. Таким образом, вы увидите, что вы получаете внутреннюю ошибку сервера, что тоже возможно.
Кроме того, у вас может быть включена защита CSRF в CodeIgniter, поэтому вам также необходимо передать хеш CSRF на сервер.
Я думаю, что проблема заключается в том, как вы отправляете свои данные контроллеру. в вашем вызове AJAX у вас есть следующее:
$.ajax({ type: "POST", url: post_url, cache: false, data: "company=" + company + "&dateFrom=" + dateFrom + "&dateTo=" + dateTo, });
вы отправляете данные в формате GET .. для того, чтобы PHP получал сообщение, вы должны сделать следующее:
$.ajax({ type: "POST", url: post_url, cache: false, data: {company: company, dateFrom:dateFrom , dateTo:dateTo} });
также, в вашем контроллере, попробуйте использовать помощники Codeigniter как таковые:
$company = $this->input->post('company'); $dateFrom= $this->input->post('dateFrom'); $dateTo= $this->input->post('dateTo');
я сомневаюсь … неправильный путь к вашей функции контроллера
ваш URL-адрес для публикации данных
var post_url = "http://localhost/ProjectSage/index.php/site/members_area";
где, когда ваша функция контроллера
function get_invoices() { ....
параметры URL-адреса ajax, путь должен указывать на функцию contoroller, о которой я сомневаюсь, что она указывает здесь в вашем коде.
не уверен, но я думаю, что это должно быть
var post_url = "http://localhost/ProjectSage/index.php/site/members_area/get_invoices";
если members_area – это ваш контроллер здесь.
и лучше отправлять данные как объекты.
data: {"company":company,"dateFrom":dateFrom,"dateTo":dateTo},
вам не нужно использовать тип содержимого при использовании echo json_encode.
$this->load->model('invoice_model'); echo json_encode($this->invoice_model->get_invoices($company, $dateFrom, $dateTo));
hmmm .. попробуйте изменить свой призыв ajax к этому:
var url = "http://..."; var dataToSend= {company: company, dateFrom: dateFrom.....}; $.post(url, dataToSend, function(data) { ...sucess code });