Я создаю форму калькулятора карт, в которой вы можете выбрать тип карты и выбрать количество, а цена будет возвращена.
Я использую CSV-файл для ценообразования, и у меня все отлично работает. как простая HTML-форма, отображаемая через шорткод в WordPress.
<?php
// Get CSV
$ch = fopen($standard_csv, "r");
$header_row = fgetcsv($ch);
// Get array of rows
$rows = array_map('str_getcsv', file($standard_csv));
// Remove first row (header row) as we already have this separately
unset( $rows[0] );
?>
<!-- The Form -->
<form action = "" method = "post" name = "calc" id = "calc">
Type:
<select name = "card" id = "card">
<option value = "">Please Select</option>
<?php
// Remove first blank cell from $header
unset( $header_row[0] );
foreach ( $header_row as $key => $card ){
echo '<option value = "' . $key . '">' . $card . '</option>';
}
?>
</select>
Quantity:
<select name = "quantity" id = "quantity">
<option value = "">Please Select</option>
<?php
foreach ( $rows as $key => $row ){
echo '<option value = "' . $key . '">' . $row[0] . '</option>';
}
?>
</select>
<input type = "submit" name = "get-price" value = "Get Price!">
</form>
<?php
if ( isset( $_POST['get-price'] ) ){
$card = $_POST['card'];
$quantity = $_POST['quantity'];
echo 'Price: £' . $rows[$quantity][$card];
}
?>
Это здорово, но я хочу отображать возвращенную цену с помощью AJAX, поэтому мне не нужно обновлять страницу, когда пользователь запрашивает цену для выбранной карты и количество.
У меня есть мои сценарии в очереди так:
wp_enqueue_script( 'custom_script', plugin_dir_url( __FILE__ ) . 'js/custom.js', array('jquery'), '1.0' );
wp_localize_script( 'custom_script-script', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ),
add_action('wp_ajax_get_price', 'get_price');
add_action('wp_ajax_nopriv_get_price', 'get_price');
function get_price(){
$card = $_POST['card'];
$quantity = $_POST['quantity'];
return 'Price: £' . $rows[$quantity][$card];
}
У меня есть это в моем файле Javascript
$('#calc').submit(function (event) {
event.preventDefault();
var card = jQuery('#card').val();
var quantity = jQuery('#quantity').val();
jQuery.ajax({
type: 'POST',
url: ajax_object.ajax_url,
data: {
action: 'get_price',
card: card,
quantity: quantity
},
success: function (data) {
console.info(data);
},
error: function (errorThrown) {
console.info(data);
alert(errorThrown);
}
});
});
Я полностью запутался, и я пытался следовать многим учебникам, но я просто не могу выработать правильную логику, чтобы иметь возможность выводить цену из файла CSV с помощью AJAX без перезагрузки страницы.
Я знаю, что этот код совершенно неверен, но, пожалуйста, любая помощь, чтобы установить меня в правильном направлении, будет очень признательна.
Мне просто нужна помощь в понимании логики того, как обрабатывать передачу переменных и цен между ajax и функцией php, чтобы вернуть цену из файла CSV.
Спасибо.
Не возвращаться из ajax - выйти.
Заменить return 'Price: £' . $rows[$quantity][$card];
с участием
wp_die('Price: £' . $rows[$quantity][$card]);
С наилучшими пожеланиями, Митчелл
1) Пожалуйста, примите ответ. 2) Я не уверен, почему console.info(data) будет отображать что-либо, кроме возвращаемого значения.
Я приму ответ, поскольку вы направили меня в правильном направлении, Митчелл, так что спасибо, что нашли время, это много значит. Сейчас разобрался и все заработало :)
Спасибо. Хотел бы я понять проблему console.info().
Привет, Митчелл, и спасибо за любезную помощь. Я попробовал это, и у меня есть прогресс! Однако в моей функции успеха я записываю данные в консоль, console.info(data); но по какой-то причине он регистрирует всю страницу HTML в консоли?