Показать комментарий после отправки

Question

На моем сайте Wordpress у меня есть стандартная форма отправки комментариев. Я добавил к нему сценарий (ajax), поэтому мне не нужно перезагружать страницу для отправки комментария. Все работает, но как показать отправленный комментарий без обновления страницы?

Мой код:

jQuery('document').ready(function($){ 
var commentform=$('form#commentform'); 
commentform.prepend('<div id="wdpajax-info" ></div>'); 
var infodiv=$('#wdpajax-info'); 
commentform.validate({ 
    submitHandler: function(form){ 
     var formdata=commentform.serialize(); 
     infodiv.html('<p>Proszę czekać...</p>'); 
     var formurl=commentform.attr('action'); 
     $.ajax({ 
      type: 'post', 
      url: formurl, 
      data: formdata, 
      error: function(XMLHttpRequest, textStatus, errorThrown){ 
       infodiv.html('<p class="wdpajax-error" >Sprawdź wszystkie pola!</p>'); 
      }, 
      success: function(data, textStatus, html){ 
       $("ul.commentlist").append(formdata); 
       $("ul.commentlist li:last").fadeIn("slow"); 
       if(data=="success") 
        infodiv.html('<p class="wdpajax-success" >Dzięki, komentarz został dodany!</p>'); 
       else 
        infodiv.html('<p class="wdpajax-error" >Błąd</p>'); 
       commentform.find('textarea[name=comment]').val(''); 
      } 
     }); 
    } 
    }); 
}); 

Answer 1

Я рекомендовал бы обновить страницу, чтобы пользователь мог видеть, что комментарий действительно был сохранен на стороне сервера. Если вы все еще хотите сделать это, не обновляя страницу, вы должны добавить новый div с комментарием. Нечто похожее на это:

success: function(data, textStatus, html){ 
      $("ul.commentlist").append(formdata); 
      $("ul.commentlist li:last").fadeIn("slow"); 
      if(data=="success") { 
       infodiv.html('<p class="wdpajax-success" >Dzięki, komentarz został dodany!</p>'); 
       // you should inicialize commentdiv with the selector of the part of the page you want to show the comment 
       commentdiv.html('<p class="comment">'+formdata+'</p>'); 
}