Возврат HTML (с PHP) после функции jQuery Ajax

Question

Я пытаюсь использовать Ajax вместе с jQuery, чтобы при нажатии на имя пользователя на моих пользовательских форумах всплыло небольшое окно.

Мой текущий код для скрипта:

$(document).ready(function () {
    $('#profile_link').click(function () {

        $.ajax({
            type: 'POST',
            url: 'viewuser.php',
            dataType: 'html',
            contentType: 'text/html',
            data: {
                username: $('#username').val()
            },
            success: function (html) {
                $('#message').addClass('success');
                $('#message').hide().append(html).fadeIn();
            }
        });

        return false;
    });
});

Я пытался использовать html (), но это совсем не сработало, поскольку он даже не отображал ответ, хотя я мог видеть ответ в Firebug.

Вот код для просмотра пользователем.php:

        <?php 
      $docRoot = getenv("DOCUMENT_ROOT");

      require_once $docRoot.'/settings.php';

      loginMySQL();

      selectDatabase();

      $user = $_POST['username'];

      $sql = mysql_query ("SELECT `UserName`,`Avatar`,`Biography`,`Birthday`,`UserLevel`,`BanStatus` FROM users WHERE `UserName` = '$user'");

      $UserInfo = mysql_fetch_array($sql);
       $UserAvatar = $UserInfo['Avatar'];
       $UserBio = $UserInfo['Biography'];
       $UserBirth = $UserInfo['Birthday'];
       $UserLevel = $UserInfo['UserLevel'];
       $BanStatus = $UserInfo['BanStatus'];

   // additional code
   ...
      ?>
      <div class="nav_space">
      </div>
// additional code
      <div class="user_profile_wrapper">
       Hello
       <?=$BanStatus;?>
       <i>Username / Power level:</i>
       <div class="user_profile_name" <?=$LevelColour;?>>
       <?=$user;?> <i><?=$UserLevel;?></i>
       </div>
       <i>User avatar:</i>
       <div class="user_profile_avatar">
      <?
       if (strlen($UserAvatar) > 1) {
       ?>
       <img/ src="<?=$UserAvatar;?>" alt="" width="100" />
       <?
       }
      ?>
       </div>
       <i>Biography:</i><br />
       <div class="user_profile_bio">
       <?=$UserBio;?>
       </div>
       <i>Birthdate:</i>
       <div class="user_profile_birthdate">
       <?=$UserBirth;?>
       </div>
       <?=$AUserLevel;?>
      </div>
      <div class="nav_space">
      </div>

И проблема в том, что когда он возвращает код, он фактически не отображает ни одну из переменных ($ BanStatus, $ UserLevel, что угодно).

Есть идеи?

Answer 1

В идеале вы не должны переключаться между <?php и <?, так как я считаю, что поддержка коротких тегов прекращается.

Кроме того, вы еще не очистили свое имя пользователя

$user = mysql_real_escape_string  ($_POST['username']);

Обновлено 1

Код ниже является рабочим примером, я немного почистил ваш код. Однако с вашим исходным кодом изменение username : $('#username').val() на username : $('#username').html() должно работать для вас.

Код для so.html

  <a href="www.google.com" id="profile_link"><div id="username">Someusername</div></a>

  <div id="message"></div>
<script>
  $("#profile_link").click(function(event){
    event.preventDefault();
    var v_username = $("#username").html();
    $.post("viewuser.php",{"username": v_username},function(data) {
      $('#message').addClass('success').hide().html(data).fadeIn();
    }, "html");

  });
</script>

Код для viewuser.php

<?php
echo "The submitted request was for the username $_POST[username]";
?>

Выход:

Отправленный запрос был на имя пользователя Someusername

Обновлено 2

Код для so.html

  <a href="www.google.com" class="profile_link"><span class="username">Username1</span></a>
    <a href="www.google.com" class="profile_link"><span class="username">Username2</span></a>

  <div id="message"></div>
<script>
  $(".profile_link").click(function(event){
    event.preventDefault();
    var v_username = $(this).children(".username").html();
    $.post("viewuser.php",{"username": v_username},function(data) {
      $('#message').addClass('success').hide().html(data).fadeIn();
    }, "html");

  });
</script>

Я еще раз обновил его для вас. Мы используем $ (this) .children (". Username"), чтобы гарантировать, что мы возвращаем имя пользователя по выбранной ссылке. Мы перешли на использование классов, поскольку теперь существует более одного экземпляра каждого элемента, и я изменил HTML-код на использование тега span, поскольку он немного более уместен.