Помогите мне правильно сделать AJAX-звонок

Question

У меня есть функция JavaScript, которая вызывается.Мне нужно, чтобы он вызывал функцию PHP и возвращал true / false.

Сценарий с функцией находится в файле /db/cancel_hike.php

Мой текущий JS выглядит так:

function uncancelHike( hike_id )
{
    //var url = "/db/cancel_hike.php;
    var success = null;

    var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

    request.open("GET", url , true);

    request.onreadystatechange = function()
    {
          if (request.readyState == 4)
          {
                var xmlDoc = request.responseXML;

                // obtain the array of markers and loop through it
                markers = xmlDoc.documentElement.getElementsByTagName("marker");

                for (var i = 0; i < markers.length; i++)
                {
                      // obtain the attribues of each marker
                      success = markers[i].getAttribute("success");

                      if ( success == "true" )
                      {
                        document.getElementById("success").style.display = 'block';
                        document.getElementById("warning").style.display = 'none';
                        document.getElementById("error").style.display = 'error';

                      }

                      if ( success == "false" )
                      {
                        document.getElementById("success").style.display = 'none';
                        document.getElementById("warning").style.display = 'none';
                        document.getElementById("error").style.display = 'block';
                      }
                }
          }
    }

    request.send(null);

    return false;
}

У меня возникли проблемы:

1. Как вызвать реальную функцию в скрипте PHP?
2. Нужно ли мне иметь некоторыеXML вернулся?Или есть способ просто вернуть возвращенное значение?
3. Я использую библиотеку YUI JS.Мне нужно сделать несколько звонков или нет необходимости в этом случае?

Answer 1

Как вызвать реальную функцию в скрипте PHP?

Ты не можешь. Вы запрашиваете URI.

Напишите сценарий PHP, который вызывает нужную функцию, и поместите ее в вызываемый вами URI.

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

Нужно ли мне возвращать XML? Или есть способ просто вернуть возвращенное значение?

Вы можете вернуть любые данные, которые вам нравятся.

Я использую библиотеку YUI JS. Мне нужно сделать несколько звонков или нет необходимости в этом случае?

Это библиотека. Вам никогда не нужно звонить на него. Это часто упрощает код, который вы должны написать.

Answer 2

1. Как вызвать реальную функцию в скрипте PHP?
2. Нужно ли мне возвращать XML? Или есть способ просто вернуть возвращенное значение?

Ну, вы не вызываете реальную функцию. То, что вы хотите сделать, это передать переменные с помощью GET, то есть, добавив их к URL-адресу, например file_name.php?var1=this&var2=that, чтобы передать var1 «this» и var2, равные «that». Вы получаете их в файле PHP с $_GET['this'] и $_GET['that']. Все, что PHP выводит на страницу через echo, print_r и т. Д., Затем отправляется обратно в объект запроса как часть его свойства responseText.

Вы только что установили url в request.open для URL на своем сайте. Например, в вашем файле .js:

request.open("GET", "answer_me.php?hike_id=" + hike_id, true);

А в вашем .php файле:

<?php
$hike_id = $_GET['hike_id'];
if ($hike_id < 5) {
  echo "true";  // echo true would return "1", BTW
} else {
  echo "false"; // echo false would return nothing
}

Обратите внимание, что это просто вернет строковое значение в request.responseText из false, таким образом, вы можете сделать это:

var result = request.responseText;

if (result === "true") {
  ...
  document.getElementById("success").style.display = "block";
  ...
} else {
  ...
  document.getElementById("success").style.display = "none";
  ...
}

Вам не нужно, чтобы это был XML, тем более что похоже, что вы на самом деле не используете цикл (тем же самым трем элементам DOM присваиваются значения каждый раз).

И, честно говоря, для AJAX я бы рекомендовал использовать фреймворк, такой как jQuery (или YUI, хотя я не считаю его AJAX интуитивным). Весь ваш код будет выглядеть так:

var $success = $("#success");
var $error = $("#error");

function cancelHikeCallback(data) {
  var is_success = (data === "true");
  $success.toggle(is_success);
  $error.toggle(!is_success);
}

function cancelHike(hikeIdToSend) {
  $.get("/db/cancel_hike.php", {hike_id: hikeIdToSend}, cancelHikeCallback);
}

IMO-вещи, такие как jQuery $.ajax ($.get - это специализированная форма $.ajax), упрощают чтение и отладку этого материала.

Пример jsFiddle