Ajax: невозможно прочитать свойство типа undefined
Может ли кто-нибудь помочь мне понять это, пожалуйста? Я пытаюсь загрузить заголовок / контент сообщения WordPress (пользовательский тип сообщения) в модальном режиме, но не могу понять это правильно. Я новичок в php и ajax, поэтому я взял фрагменты кода из разных руководств и пытаюсь собрать их все вместе.
Итак, сначала я добавляю путь для локализации моего скрипта:
wp_localize_script( 'darkam_global', 'openpost', array(
'ajaxurl' => admin_url( 'admin-ajax.php' )
));
Вот как выглядит моя функция php:
add_action( 'wp_ajax_nopriv_open_post', 'my_open_post' );
add_action( 'wp_ajax_open_post', 'my_open_post' );
function my_open_post() {
$id = $_GET['id'];
$post = get_post($id);
if ($post){
wp_send_json(array('post_title' => $post->post_title, 'post_content' => $post->post_content));
} else {
wp_send_json(array('error' => '1'));
}
wp_die();
}
и мой jQuery:
( function( $ ) {
var $modalTrigger = $('.js-modal-trigger');
$modalTrigger.click( open_post_js );
function open_post_js(id) {
jQuery.ajax({
url: openpost.ajaxurl,
type: 'POST',
data: {
id: id,
action: 'open_post'
},
success: function( result ) {
alert( result['post_title'] );
}
})
}
} )( jQuery );
Когда я запускаю модальное окно, я получаю консольную ошибку: Uncaught TypeError: Cannot read property 'type' of undefined. Также результат предупреждения отображается как «undefined».
Любая помощь будет очень признательна :)
никогда не используйте alert() для чего-либо, кроме простых типов (строки / числа) - всегда используйте console.info
Спасибо за совет! console.info возвращает: {error: "1"}
Ответы 3
вы пробуете этот код:
header("Access-Control-Allow-Origin: *");
header( 'Content-Type: application/json;' );
if ($post){
wp_send_json(array('post_title' => $post->post_title, 'post_content' => $post->post_content));
} else {
wp_send_json(array('error' => '1'));
}
wp_die();
Спасибо за предложение, Куан Ли! Мне удалось заставить его работать с принятым ответом!
В вашем php вы возвращаете действительный ответ {error:1}, но вы не проверяете это в своем jquery / ajax.
Так что, вероятно, это ошибка в файле php.
является не работает в php, потому что вы не передаете id.
При подключении к событию click у вас есть:
$modalTrigger.click(open_post_js)
поэтому щелчок аналогичен вызову:
open_post_js();
но ваша сигнатура функции: function open_post_js(id), поэтому она ожидает id, например:
open_post_js(1);
id затем "передается" в php, но поскольку он не передается в javascript, php его не получает, поэтому падает.
Как это исправить? Вам необходимо передать id в open_post_jsили, чтобы получить id в open_post_js, например:
function open_post_js() {
var id=$(this).data("id");
...
}
потом
<div class='js-modal-trigger' data-id = "1">...</div>
Огромное спасибо за подробное объяснение @ freedomn-m! Я только что попробовал ваше предложение, и хотя я больше не получаю ошибку консоли, журнал консоли все равно возвращает: {error: “1”}, что, вероятно, означает, что он не получает идентификатор сообщения из моей функции php. Как я мог это исправить?
Проверьте, что вы отправка в php. Похоже, он все еще не отправляет его (и убедитесь, что у вас есть соответствующий идентификатор для get_post
На самом деле это не то, что я «отправляю», а то, что я должен «получать» от php, поэтому я изменил тип ajax на GET, и теперь он работает как шарм :) Большое спасибо за вашу помощь, свобода! очень ценится!
Я не знаю, как php обрабатывает параметры с GET против POST. jquery обычно отправляет данные в body для POST и в URL-адресе для GET, так что, возможно, это то, как вы читаете параметр POST. Если вы действительно получаете данные, то в любом случае лучше использовать GET.
Ваш PHP выглядит хорошо, проблема в том, что id в вашем JavaScript не имеет присвоенного значения.
Если идентификатор сообщения является атрибутом данных для элемента, по которому щелкают, тогда это должно работать (при условии, что атрибут данных называется data-id):
( function( $ ) {
var $modalTrigger = $('.js-modal-trigger');
$modalTrigger.click( open_post_js );
function open_post_js() {
var id = $(this).data('id');
jQuery.ajax({
url: openpost.ajaxurl,
type: 'POST',
data: {
id: id,
action: 'open_post'
},
success: function( result ) {
alert( result['post_title'] );
}
})
}
} )( jQuery );
ах, я не видел, что свобода, я дал тот же ответ передо мной
Ваша помощь по-прежнему очень ценится! спасибо за ваш вклад, Саймон!
Что возвращает
console.info(result);?