Ajax отправляет параметры через URL

Я новичок в ajax и подумал, что это будет забавный эксперимент для моего проекта. Я создал свою собственную функцию типа лайтбокса, чтобы отправить сообщение на веб-сайте, который я создаю. Когда пользователь нажимает «Отправить сообщение», появляется лайтбокс, а вверху я пытаюсь заставить его сказать «Отправить сообщение пользователю», где пользователь — это имя пользователя, которому они тоже отправляют сообщение. . Мои HTML-элементы лайтбокса фактически находятся на отдельной веб-странице, поэтому я использую ajax. это то, что у меня есть до сих пор, и я не могу понять, в чем проблема:

страница user.php

<div id = "pageMiddle"> // This div is where all the main content is.
  <button onclick = "showMessageBox(UsersName)">Send Message</button>
</div>

Примечание. Имя пользователя правильно передается в функцию javascript, я это проверил.

страница main.js

function showMessageBox(user){
  alert(user); // where i checked if username passes correctly
  var ajaxObject = null;
  if (window.XMLHttpRequest){
    ajaxObject = new XMLHttpRequest();
  }else if (window.ActiveXObject){
    ajaxObject = new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (ajaxObject != null){
    ajaxObject.open("GET", "message_form.php", true);
    ajaxObject.send("u="+user);
  }else{
    alert("You do not have a compatible browser");
  }
  ajaxObject.onreadystatechange = function(){
    if (ajaxObject.readyState == 4 && ajaxObject.status == 200){
      document.getElementById("ajaxResult").innerHTML = ajaxObject.responseText;
      // use jquery to fade out the background and fade in the message box
      $("#pageMiddle").fadeTo("slow", 0.2);
      $("#messageFormFG").fadeIn("slow");
    }
  };
}

страница message_form.php

<div id = "messageFormFG">
  <div class = "messageFormTitle">Sending message to <?php echo $_GET['u']; ?></div>
</div>

Примечание. При доступе к этой странице напрямую через URL-адрес с указанием параметра u и значения она отображается правильно


get parameters send ajax
person Vince    schedule 24.06.2013    source источник

Ответы (5)


arrow_upward
6
arrow_downward

Используйте jQuery.ajax(); http://api.jquery.com/jQuery.ajax/

$.ajax({
  type: "GET",
  url: "message_form.php",
  data: { name: "John", location: "Boston" }
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});
person Brian Lewis    schedule 24.06.2013

arrow_upward
0
arrow_downward

причудливый способ сделать это (старая школа) :) в любом случае, я думаю, проблема может заключаться в том, что вы загружаете всю html-страницу в div! имея в виду теги и прочее, хороший способ понять, что не так, - использовать отладчик и посмотреть, что приходит в ajaxObject.responseText.

Надеюсь это поможет.

Кстати конвертировать в jQuery ajax!! экономит кучу времени =)

person CarlosB    schedule 24.06.2013

arrow_upward
0
arrow_downward

Я считаю, что вам нужно добавить заголовок запроса перед отправкой ваших данных. Итак, у вас будет это:

ajaxObject.open("GET", "message_form.php", true);
ajaxObject.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
ajaxObject.send("u="+encodeURIComponent(user));

Вместо того, что у вас есть.

Однако может быть хорошей идеей позволить библиотеке сделать это за вас. Похоже, у вас уже загружен jQuery, так почему бы не позволить ему вместо этого обрабатывать ваши AJAX-запросы?

person CamHenlin    schedule 24.06.2013
comment
это не требуется при использовании библиотеки jQuery ajax. - person CarlosB; 24.06.2013
comment
Правильно, КарлосБ. Это необходимо только в том случае, если не используется jQuery, как это делал оригинальный постер. Я указал, что было бы неплохо использовать jQuery после того, как объяснил, как правильно обрабатывать запрос без jQuery. - person CamHenlin; 24.06.2013

arrow_upward
0
arrow_downward

Я понял это после просмотра нескольких руководств по ajax от bucky :) aka thenewboston. Если я использую метод GET, мне просто нужно было добавить параметр в конец URL-адреса в функции .open вместо того, чтобы передавать его через функцию отправки (как вы бы использовали метод публикации).

person Vince    schedule 03.07.2013

arrow_upward
0
arrow_downward

если вы хотите отправить количество значений поля с помощью ajax. вы можете использовать функцию сериализации.

Пример:

jQuery.ajax({
        url: 'filenamehere.php',
        type: 'post',
        data: $("#formidhere").serialize(),
        success: function(data){
    ..//

        }
    });
person hitesh nagpal    schedule 30.03.2015