За последние 24 часа нас посетил 54241 программист и 1727 роботов. Сейчас ищут 843 программиста ...

Динамический вывод данных

Тема в разделе "JavaScript и AJAX", создана пользователем Jnas, 4 июл 2011.

  1. Jnas

    Jnas Активный пользователь

    С нами с:
    31 май 2011
    Сообщения:
    22
    Симпатии:
    0
    Добрый день уважаемые формучанины
    Сразу скажу в JavaScript и AJAX я полный чайник, прям до горлышка полный)

    короче есть у мня форма, туда пользователи вводят назовем так ID, нажимают кнопку "отправить"
    выходит надпись "Подожди пожалуйста, идет загрузка!"
    После загрузки данных надпись исчезает и выводит данные, но через определенное время данные тоже исчезают, это сделано для того, чтоб при повторной нажатии на кнопку отправить c новыми ID информация не путалась

    Но со временем это меня перестало устраивать, как сделать так, чтоб данные не исчезали через определенное время, а только при повторном вводе ID и при нажатии на кнопку отправить данные от прошлого запроса исчезали появлялась надпись "Подожди пожалуйста, идет загрузка!" и выводила далее данные и т.д.

    Имеющийся код

    HTML:
    1.  
    2.  
    3. <script type="text/javascript" src="jquery.js"></script>
    4. </head>
    5.  
    6.    
    7.     <form id="myForm">
    8.     Вставте ID:<br/>
    9.         <input id="username" type="text" size="90"><br/>
    10.         <input type="submit" value="Отправить">
    11.     </form>
    12.  
    13.     <form id="ajax">
    14.  
    15.     </form>
    16.     <div id="content"></div>
    17.    
    18.     <script>
    19.         $(document).ready(function(){
    20.        
    21.             $('#myForm').submit(function(){
    22.                 $.ajax({
    23.                     type: "POST",
    24.                     url: "id.php",
    25.                     data: "username="+$("#username").val(),
    26.                     success: function(html){
    27.                         $("#content").html(html).fadeIn(1000).fadeOut(15000);
    28.                    }
    29.                 });
    30.                 return false;
    31.             });
    32.            
    33.         });
    34.        
    35.         $('#ajax').ajaxStart(function() {
    36.         $(this).text('Подожди пожалуйста, идет загрузка!');
    37.         $(this).fadeIn(1000);
    38.     });
    39.     $('#ajax').ajaxComplete(function() { $(this).fadeOut(1000); });
    40.     </script>
    41.    
    42. </body>
    43. </html>
    44.  
    [/html]
     
  2. Gromo

    Gromo Активный пользователь

    С нами с:
    24 май 2010
    Сообщения:
    2.786
    Симпатии:
    2
    Адрес:
    Ташкент
    надо убрать .fadeOut(15000)
     
  3. Jnas

    Jnas Активный пользователь

    С нами с:
    31 май 2011
    Сообщения:
    22
    Симпатии:
    0
    Спасибо Gromo.
    Но теперь осталась еще одна проблема.
    При повторном отправке ID выходить следующая картина, вернее показывает :

    как сделать так, чтоб при отправки ID предыдущие данные стирались, то есть виднелась только надпись
     
  4. zebra

    zebra Активный пользователь

    С нами с:
    11 июн 2011
    Сообщения:
    16
    Симпатии:
    0
    Код (Text):
    1.  
    2. $(this).text('Подожди пожалуйста, идет загрузка!');
    Заменить на
    Код (Text):
    1. $(this).html('Подожди пожалуйста, идет загрузка!');
     
  5. Gromo

    Gromo Активный пользователь

    С нами с:
    24 май 2010
    Сообщения:
    2.786
    Симпатии:
    2
    Адрес:
    Ташкент
    наверно так, но не уверен

    $('#myForm').submit(function(){
    $("#content").fadeOut();
    $.ajax({
     
  6. Jnas

    Jnas Активный пользователь

    С нами с:
    31 май 2011
    Сообщения:
    22
    Симпатии:
    0
    Работает! Спасибо!