У меня есть сайт WordPress с двумя выпадающими списками. Когда я выбираю параметр в первом раскрывающемся списке, я хочу, чтобы второй был обновлен данными из функции PHP. Для этого мне нужен ajax. Но я борюсь с привязкой ajax к WordPress.
HTML выглядит так:
<form method="get" action="http://siradjov.anex.at/playground/"> <div class="form-inner"> <div class="listing-search-main"> <input type="text" class="listing-search-text text" name="s" title="Coach House, Golf Course, Water View, etc" value="unique"> <input type="submit" class="listing-search-submit btn btn-large btn-primary" name="search-submit" value="Search"> </div><!-- .listing-search-main --> <div class="listing-search-details"> <div class="listing-search-field listing-search-field-select listing-search-field-status"> <select class="listing-search-status select" name="status"> <option value="">Status</option> <option value="sale">Sales</option> <option value="rent">Rentals</option> <option value="foreclosure">Foreclosure</option> </select> <div class="listing-search-advanced " style="display: block;"> <div class="listing-search-field listing-search-field-select listing-search-field-min"> <select class="listing-search-min select" name="min"> <option value="">Price (min)</option> <option value="100000">100.000</option> <option value="200000">200.000</option> <option value="300000">300.000</option> <option value="400000">400.000</option> </select> Теперь, когда, например, пользователь выбирает «Sales», я хочу, чтобы второй тег select был перезагружен с соответствующими ценами из массива PHP.
Функция PHP выглядит так:
<?php $selectedStatus = $_POST['status']; if($selectedStatus == "sale") { // Set price (min) to select $fields['min']['type'] = 'select'; // Set price (min) select options $fields['min']['data'] = array( '100000' => '120,000', '120000' => '200.000', '130000' => '300.000', ); // Set price (max) to select $fields['max']['type'] = 'select'; // Set price (max) select options $fields['max']['data'] = array( '100000' => '120,000', '120000' => '200.000', '130000' => '300.000', ); } else if($selectedStatus == "rent") { // Set price (min) to select $fields['min']['type'] = 'select'; // Set price (min) select options $fields['min']['data'] = array( '200' => '200', ); // Set price (max) to select $fields['max']['type'] = 'select'; // Set price (max) select options $fields['max']['data'] = array( '200' => '200', ); } echo $fields;
Я сохранил вызов jQuery Ajax в отдельном файле .js. Код следующий:
jQuery(document).ready(function() { jQuery(".listing-search-status.select[name='status']").change(function() { if (this.value == "sale") { jQuery.ajax({ type: "POST", url: "http://siradjov.anex.at/playground/wp-content/plugins/wpcasa-extended-search-status-price-chain-select/wpcasa_custom_prices.php", data: { status : "sale" }, success: function(data) { alert('Sale' + data['min']['data'][0]); } }); } else { if (this.value == "rent") { jQuery.ajax({ type: "POST", url: "http://siradjov.anex.at/playground/wp-content/plugins/wpcasa-extended-search-status-price-chain-select/wpcasa_custom_prices.php", data: { status : "rent" }, success: function(data) { alert('Rent' + data['min']['data'][0]); } }); } } }); });
Но боксеры предупреждения не отображаются. Я также не получаю сообщений об ошибках в консоли Google Chrome. Может кто-нибудь мне помочь?
Используйте собственные методы, которые WordPress предоставляет вам для использования ajax-запросов.
В вашем файле плагина нам нужно добавить пару действий, чтобы мы могли отправлять запросы ajax и проанализировать их с admin-ajax.php файла admin-ajax.php .
add_action('wp_ajax_nopriv_ajax_request', 'ajax_controller'); add_action('wp_ajax_ajax_request', 'ajax_controller');
Теперь мы создаем контроллер ajax в нашем файле плагина. Цель этого – действовать как контроллер, который будет переключать его вывод на основе параметра FN предоставленного с помощью запроса ajax (подробнее об этом позже)
function ajax_controller(){ $ret = ''; //our return variable switch($_REQUEST['fn']): case 'status' : $ret = update_status($_REQUEST['status']); break; endswitch; echo $ret; die(); //this makes sure you don't get a "1" or "0" appended to the end of your request. }
Обратите внимание, что была создана функция update_status() для инкапсуляции вышеуказанного PHP-кода.
Теперь мы имеем связанные действия и контроллер, который мы можем бесконечно использовать для извлечения данных. Нам просто нужно внести пару изменений в вызов ajax. Во-первых, мы можем использовать тройное назначение для переключателя «аренда / продажа», в отличие от двух вызовов ajax, которые будут чистить вещи. Во-вторых, нам нужно изменить адрес URL-адреса в файле /wp-admin/admin-ajax.php .
var $status = (this.value == "sale") ? this.value : 'rent'; jQuery.ajax({ type: "POST", url: "/wp-admin/admin-ajax.php", data: { action: 'ajax_request', fn : 'status', //this is the $_REQUEST['fn'] from above status : $status }, success: function(data){ alert('Sale' + data['min']['data'][0]); } });
Требуется параметр action , fn является результатом моих принципов кодирования. Атрибут action должен непосредственно соответствовать тому, что приходит после add_action('wp_ajax_nopriv_ и add_action('wp_ajax_ .
Это должно решить проблему.