WordPress + JavaScipt + AJAX + MySQL: вставить запрос для формы

Я пытаюсь сделать заказ – плагин с формой на сайте wordpress-admin, где я могу добавить новое событие в календаре (сделанное с помощью JavaScript). Я должен отправить форму со всеми данными и вставить данные в базу данных MySQL.

Мой файл ajax.js :

function ajaxSubmit(e){ var nazwa_szkolenia = document.getElementById("nazwa_szkolenia").value; var Data_szkolenia = document.getElementById("Data_szkolenia").value; var Godzina = document.getElementById("Godzina").value; var Max_pacjent = document.getElementById("Max_pacjent").value; // Returns successful data submission message when the entered information is stored in database. var dataString = 'nazwa_szkolenia1=' + nazwa_szkolenia + '&Data_szkolenia1=' + Data_szkolenia + '&Godzina1=' + Godzina + '&Max_pacjent1=' + Max_pacjent; if (nazwa_szkolenia == '' || Data_szkolenia == '' || Max_pacjent == '') { alert("fill all fields"); } else { // prevent the default action. e.preventDefault(); var myform= jQuery(this).serialize(); jQuery.ajax({ type:"POST", // Get the admin ajax url which we have passed through wp_localize_script(). url: ajax_object.ajax_url, action: "submitAjaxForm", data: dataString, error: function(jqXHR, textStatus, errorThrown){ console.error("The following error occured: " + textStatus, errorThrown); }, success:function(data){ alert("process ok"); } }); } return false; } 

arcode-functions.php :

 <?php add_action('init', 'registerFormAction'); function registerFormAction(){ add_action('wp_ajax_nopriv_submitAjaxForm','submitAjaxForm_callback'); add_action('wp_ajax_submitAjaxForm','submitAjaxForm_callback'); } function submitAjaxForm_callback(){ global $wpdb; $nazwa_szkolenia2 = $_POST['nazwa_szkolenia1']; $Data_szkolenia2 = $_POST['Data_szkolenia1']; $Godzina2 = $_POST['Godzina1']; $Max_pacjent2 = $_POST['Max_pacjent1']; $wpdb->insert( $wpdb->modul_terminarz, array( 'proba' => $nazwa_szkolenia2, 'id' => '10', 'data_szkolenia' => $Data_szkolenia2, 'typ_szkolenia' => '1', 'ile_miejsc' => $Max_pacjent2, 'pelne' => '1', 'Ile_miejsc_akt' => '4' ) ); wp_die(); } ?> 

Я добавил admin-ajax.php с функцией wp_localize_script . Кнопка формы выполнена с использованием JavaScript:

 var Input_Form_Send = document.createElement('input'); Input_Form_Send.value = 'Utwórz'; Input_Form_Send.type = 'submit'; Input_Form_Send.className = 'input-form-send'; Input_Form_Send.onclick = ajaxSubmit; 

Когда я заполняю все поля из формы, щелкаю по кнопке, затем появляется предупреждение «процесс нормально», но в базе данных ничего нового нет … nazwa_szkolenia , Data_szkolenia , Godzina , Max_pacjent – это имена полей формы.

Может быть, вы знаете, что я сделал неправильно?

Solutions Collecting From Web of "WordPress + JavaScipt + AJAX + MySQL: вставить запрос для формы"

Почему вы сериализуете данные с помощью jQuery, но не передаете эту переменную через AJAX? Я предполагаю, что данные должны быть в массиве, а не как строка данных, например URL.

Вы можете проверить, попадают ли данные в функцию обратного вызова AJAX, возвращая значение данных и отображая их в alert() в функции успеха.

Что для меня работает – это помещать данные в реляционный массив и использовать GET вместо post.

var dataString = []; dataString['nazwa_szkolenia1'] = nazwa_szkolenia; // etc.

Надеюсь это поможет.

Я немного почистил все. Теперь это выглядит так:

ajax.js

 function ajaxSubmit(e){ var nazwa_szkolenia = document.getElementById("nazwa_szkolenia").value; var Data_szkolenia = document.getElementById("Data_szkolenia").value; var Godzina = document.getElementById("Godzina").value; var Max_pacjent = document.getElementById("Max_pacjent").value; var dataString = []; dataString['nazwa_szkolenia1'] = nazwa_szkolenia; dataString['Data_szkolenia1'] = Data_szkolenia; dataString['Godzina1'] = Godzina; dataString['Max_pacjent1'] = Max_pacjent; if (nazwa_szkolenia == '' || Data_szkolenia == '' || Godzina == '' || Max_pacjent == '') { alert("Wypełnij wszystkie pola"); } else { // prevent the default action. e.preventDefault(); //var myform= jQuery(this).serialize(); jQuery.ajax({ type:"GET", // Get the admin ajax url which we have passed through wp_localize_script(). url: ajax_object.ajax_url, action: "submitAjaxForm", data: dataString, error: function(jqXHR, textStatus, errorThrown){ console.error("The following error occured: " + textStatus, errorThrown); }, success:function(data){ console.log(dataString); } }); } return false; } 

arcode-functions.php:

 <?php function registerFormAction(){ add_action('wp_ajax_nopriv_submitAjaxForm','submitAjaxForm_callback'); add_action('wp_ajax_submitAjaxForm','submitAjaxForm_callback'); } function submitAjaxForm_callback(){ global $wpdb; $nazwa_szkolenia2 = $_GET['nazwa_szkolenia1']; $Data_szkolenia2 = $_GET['Data_szkolenia1']; $Godzina_szkolenia2 = $_GET['Godzina1']; $Max_pacjent2 = $_GET['Max_pacjent1']; $result = $wpdb->insert( $wpdb->modul_terminarz, array( 'Nazwa_szkolenia' => $nazwa_szkolenia2, 'Data_szkolenia' => $Data_szkolenia2, 'Godzina_szkolenia' => $Godzina_szkolenia2, 'Typ_szkolenia' => '1', 'Ile_miejsc_max' => $Max_pacjent2, 'Pelna_obsada' => '0', ) ); wp_die(); } add_action('init', 'registerFormAction'); ?> 

этот код остается в моем menu.php :

 // Hook for adding admin menus add_action('admin_menu', 'create_Terminarz_menu'); // action function for above hook /** * Adds a new top-level page to the administration menu. */ function create_Terminarz_menu() { add_menu_page( 'ARCode Terminarz', 'Terminarz', 'manage_options', 'zarzadzanie-terminami', 'tm_zarzadzanie_terminami_odp', plugins_url('images/terminarz.png', __FILE__),'2.2.10' ); add_submenu_page( 'zarzadzanie-terminami', 'ARCode Terminarz' . 'Terminy szkoleń', '<b style="color:#E46500;">Terminy szkoleń</b>', 'manage_options', 'zarzadzanie-terminami', 'tm_zarzadzanie_terminami_odp'); add_submenu_page( 'zarzadzanie-terminami', 'ARCode Terminarz' . 'Pacjenci', 'Pacjenci', 'manage_options', 'pacjenci', 'tm_zarzadzanie_pacjentami_odp'); add_action('admin_enqueue_scripts','load_custom_wp_admin_js'); } /** * Disply callback for the Unsub page. */ function tm_zarzadzanie_pacjentami_odp() { } function load_custom_wp_admin_js($hook){ wp_register_script( 'jquery.min.js', plugin_dir_url( __FILE__ ) . 'js/jquery.min.js', array('jquery')); wp_enqueue_script( 'jquery.min.js' ); wp_enqueue_style( 'kalendarz',plugin_dir_url( __FILE__ ) . 'kalendarz.css',false,'1.1','all' ); wp_register_script( 'ajax-script', plugin_dir_url( __FILE__ ) . 'ajax_js.js'); wp_localize_script('ajax-script', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php'))); wp_enqueue_script( 'ajax-script', plugin_dir_url( __FILE__ ) . 'ajax_js.js'); } /** * Disply callback for the Unsub page. */ function tm_zarzadzanie_terminami_odp() { include_once( 'arcode-functions.php'); include_once( 'kalendarz.php'); ?> <div class="wrap" style="position: fixed; width: 85%; top: 40px; bottom: 80px;"> </div> <?php } 

В kalendarz.php у меня есть все функции для бронирования календаря и форм, это форма, которую мне нужно отправить:

 this.createFormular = function () { var ob = this.o; var Admin_Form = document.createElement('form') Admin_Form.name='Formularz_Admin'; Admin_Form.method='GET'; Admin_Form.action=''; var tabela = document.createElement('table'); tabela.className = 'formular-table'; var tr = document.createElement('tr'); tabela.appendChild(tr); var td = document.createElement('td'); td.appendChild(document.createTextNode('Nazwa szkolenia: ')); tr.appendChild(td); tr.appendChild(td); td.appendChild(Input_Name_Training); var tr = document.createElement('tr'); tabela.appendChild(tr); var td = document.createElement('td'); td.appendChild(document.createTextNode('Data szkolenia: ')); tr.appendChild(td); tr.appendChild(td); td.appendChild(Input_Date_Training); var tr = document.createElement('tr'); tabela.appendChild(tr); var td = document.createElement('td'); td.appendChild(document.createTextNode('Godzina szkolenia: ')); tr.appendChild(td); tr.appendChild(td); td.appendChild(Input_Hour_Training); var tr = document.createElement('tr'); tabela.appendChild(tr); var td = document.createElement('td'); td.appendChild(document.createTextNode('Max ilość osób: ')); tr.appendChild(td); tr.appendChild(td); td.appendChild(Input_How_Many_People); var tr = document.createElement('tr'); tabela.appendChild(tr); var td = document.createElement('td'); td.appendChild(document.createTextNode(' ')); tr.appendChild(td); tr.appendChild(td); td.appendChild(Input_Form_Send); Admin_Form.appendChild(tabela); this.divForm.appendChild(Admin_Form); }; 

Я попытался проверить, работает ли submitAjaxForm , я проверил его с помощью эха, как сказал Скотт, но он ничего не дает. DataString дает правильный массив, но данные дают 0 … Я не знаю, что я делаю неправильно / Я не вижу, плохо ли крючок регистрироваться для submitAjaxForm, на мой взгляд, все перехватчики в порядке …?