Блог

Я очень новичок в вызовах AJAX из jQuery, и я немного застрял, пытаясь сделать это; У меня есть вызов AJAX из jQuery, подобный этому:

 $(document).ready(function() {
$('tr.table-row').click(function(){
$.ajax({ url: 'stats-render.php', data: {ref: $(this).attr('id')}, type: 'post', success: function(d) {//the_output_here}});
});
});
  

Этот скрипт находится внутри веб-страницы, запускаемой, когда пользователь попадает в определенную строку ( <tr></tr> ) из таблицы. stats-render.php выводит HTML-текст с некоторой информацией и графикой. Этот ответ иногда занимает некоторое время (15 секунд), поэтому я хотел бы показать пользователю ожидающее сообщение, когда он / она запускает скрипт, и когда вызов возвращает ответ, покажите выходной текст в div (давайте назовем его <div id="render-div"> ).

Итак, вопросы в том, как я могу показать ожидающее сообщение? Если вы знаете хороший скрипт для отображения этого в модальном формате, я был бы признателен.

Как я могу вывести результат из stats-render.php в div ?. Большое спасибо munch за любую помощь!

Просто отобразите загрузочное сообщение в div, куда промежуточно отправляются результаты.

 $(document).ready(function() {
    $('tr.table-row').click(function(){
    $.ajax({ url: 'stats-render.php', data: {ref: $(this).attr('id')}, type: 'post', success: function(d) { $('div.for-results').html( /* d... */ ); });
    $('div.for-results').html('loading...');
    });
});
  

Или для еще большего удовольствия:

 $(document).ready(function() {
    $('tr.table-row').click(function(){
    $.ajax({ url: 'stats-render.php', data: {ref: $(this).attr('id')}, type: 'post', success: function(d) {
        clearInterval(loading);
        $('div.for-results').html( /* d... */ );
    });
    $('div.for-results').html('loading');
    var loading = setInterval(function() { $('div.for-results')[0].innerHTML  = '.' }, 1000);
    });
});
  

Вероятно, самый простой вариант — проверить плагин для загрузки jquery.

Я просто показываю сообщение перед вызовом и скрываю его при успешном обратном вызове следующим образом:

Однако я думаю, что в jquery может быть опция обратного вызова при запуске ajax-вызова и при его остановке.

  $(document).ready(function() {
$('tr.table-row').click(function(){

//Show the loading message, or chage a css class, or what have you.
$('#loadingmessagetext').show();  

$.ajax({ url: 'stats-render.php', data: {ref: $(this).attr('id')}, type: 'post', success: function(d) {

//Hide the loading message
$('#loadingmessagetext').hide();  

//the_output_here

}
});
});
});