@vitaliyharchenko

Асинхронный запрос jquery. В чем ошибка?

На сайте есть кнопки, они реализованы списком. Событие клика по ним обрабатывается данным скриптом, расположенным в страницы:
$( "li" ).click(function() {
        $.ajax({
          url: 'http://blabla.ru/test.php',
          data: 'user_id=3&game_id=3',
          async: true,
          success: function(responseData, textStatus){
            alert(responseData + textStatus);
          },
          error: function(data){
            alert('Все плохо');
          },
          type: "POST",
          dataType: "text"
        });         
      });


Обработчик на другом сервере, его код:
<?php
$user_id = $_POST['user_id'];
$game_id = $_POST['game_id'];
header('Access-Control-Allow-Origin: http://sportcourts.ru');
header('Content-type: text/html; charset=utf-8');
echo 'номер игры:'.$game_id.' номер юзера:'.$user_id;
?>


При этом код не срабатывает и выдается "все плохо"

Если запрос сделать синхронным, то есть оставить:
$.ajax({
          url: 'http://blabla.ru/test.php',
          data: 'user_id=3&game_id=3',
          async: true,
          success: function(responseData, textStatus){
            alert(responseData + textStatus);
          },
          error: function(data){
            alert('Все плохо');
          },
          type: "POST",
          dataType: "text"
        });

то все работает отлично.

В чем ошибка? И что делать в этой ситуации?

Мне нужно реализовать асинхронное получение ответа от апи по клику на кнопку.
  • Вопрос задан
  • 5052 просмотра
Пригласить эксперта
Ответы на вопрос 4
PafNutY
@PafNutY
Люблю кодить в своё удовольствие
А так?
$(document).on('click', 'li', function() {
	var user_id = 3,
		game_id = 3;
	$.ajax({
		url: 'http://blabla.ru/test.php',
		data: {
			user_id: user_id,
			game_id: game_id
		},
		async: true,
		success: function (responseData, textStatus) {
			alert(responseData + textStatus);
		},
		error: function (data) {
			alert('Все плохо');
		},
		type: "POST",
		dataType: "text"
	});

});
Ответ написан
@s1dney
Убрав вызов функции ajax из функции клика это не делает его синхронным в привычном понимании "синхронности".
Если функция вообще отрабатывает, и при этом выдает ошибку, то это говорит о том, что ajax выполнил запрос неудачно, что странно. Может быть сразу несколько запросов делаете?
Попробуйте так:
$( "li" ).click(function() {
        $.ajax({
          url: 'http://blabla.ru/test.php',
          data: 'user_id=3&game_id=3',
          async: true,
          type: "POST",
          dataType: "text"
        }).done(function(response, status) {
        	alert(response + status);
        });
});
Ответ написан
Serhioromano
@Serhioromano
Web Developer
Я думаю проблема в том что вы с одного урл пытаетесь сделать аякс запрос на другой домен. Здесь нужно точно проверить что вы на sportcourts.ru а не на www.sportcourts.ru. Попробуйте

header('Access-Control-Allow-Origin: *');
Ответ написан
@vitaliyharchenko Автор вопроса
Проблема, как выяснилось, была в двух вещах:

Во-первых в интерпретации клика по тегу p шаблонизатором (button)

Также была ошибка в установке заголовков на api сервере на питоне. Всем спасибо за помощь =)
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы