Postar e Responder Tópicos em modo AJAX

Detalhes da questão

Endereço do fórum: http://worldofwitchcraft.forumeiros.com
Versão do fórum: ModernBB

Descrição

Olá pessoas!

Gostaria de saber qual código ou como postar tópicos e responder tópicos em modo AJAX, sem que redirecione para aquela página de informações sobre o envio da mensagem...

Creio que seja um código JS para isto, porém, peço ajuda de vocês! 


Espero respostas, até mais o/

@Edit: Sobre a parte de criar tópico em ajax, o redirecionamento seria para o tópico criado após o aviso ao invés para a página de informações.

Olá @ShadouS,
Adicione este JS ao seu fórum:

Código:

/ *
* Código: Postar mensagem sem refresh
* Versão: 1.0
* Autor: Daemon
* Data: 17/09/2016
*/
$(document).on("ready", function() {
 
$("body").append(
'<style>' +
'.alert-success, .alert-error {' +
'    -moz-box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
'    -webkit-box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
'    background: url(http://imgur.com/J3aqwYE.png) repeat-x 0 0;' +
'    box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
'    display: block;' +
'    font-size: 12px;' +
'    line-height: 1.6;' +
'    padding: 10px;' +
'    text-shadow: 0 1px 0 rgba(255,255,255,0.5);' +
'}' +
'.alert-success {' +
'    background-color: #cde3a4;' +
'    border: 1px solid #a8c471;' +
'    color: #436500;' +
'}' +
'.alert-error {' +
'    background-color: #ffbdbd;' +
'    border: 1px solid #d8aba7;' +
'    color: #92463f;' +
'}' +
'</style>'
);
 
var hrefResposta = $("a[href^='/post?t=']").attr("href");
var form = $("#quick_reply");
 
$("<div id='resultados_ajax'></div>").prependTo(form);
 
$("#quick_reply").submit(function(form) {
 
  var resAjax = $("#resultados_ajax"); // Elemento resultados_ajax
  var textEditorVal = $("textarea").sceditor("instance").val(); // Valor do editor
  var min = 10; // Mínimo de caracteres para o post
  var max = 15000; // Máximo de caracteres para o post (Não ultrapasse o valor limite estipulado pela forumeiros)
 
  if(textEditorVal.length < min) {
    resAjax.html("Digite pelo menos " + min + " caracteres para enviar o post").attr("class","alert-error");
    return false;
  }
  if(textEditorVal.length > max) {
    resAjax.html("Seu post ultrapassou o limite de " + max + " caracteres").attr("class","alert-error");
    return false;
  }
 
  $("input[type='submit']").attr("disabled", true);
  var parametros = $(form).serialize();
  $.ajax({
      type: "POST",
      url: hrefResposta,
      data: parametros + "&message=" + textEditorVal + "&post=1",
      beforeSend: function(objeto){
            resAjax.html("Carregando...").attr("class", false);
      },
      success: function(dados){
          var href = $("a[href^='/viewtopic']", dados).attr("href");
              $.get(href, function(e) {
                  $(".post:last", e).hide().insertAfter(".post:last").slideDown("fast", function() {
                      $("html, body").animate({
                          scrollTop: $(".post:last").offset().top
                      }, 500);
                  });
              });
              resAjax.html("Postado com sucesso!").attr("class","alert-success");
              $("input[type='submit']").attr("disabled", false);
              $("textarea").sceditor("instance").val("");
      }
  });
  return false;
});
 
});


Atenciosamente,

@Edit:

Eu coloquei o código, e apliquei nos tópicos, mas não está funcionando, apenas aparece o aviso e repete a mensagem anterior; ou seja, não está postando a mensagem enviada.

Olá,

Por favor, tente este:

Código:

(function ($) {
  'use strict';
 
  var ajaxPostingConfig = {
    'minForPost': 15,
    'maxForPost': 15000
  };
 
  var ajaxPostingStyles = [
    '.ajax-alert {',
    '  width: 70%;',
    '  text-align: center;',
    '  margin: 20px auto;',
    '  color: #555;',
    '  background-color: transparent;',
    '  border: solid 1px #ddd;',
    '  border-bottom-width: 2px;',
    '  border-radius: 3px;',
    '  padding: 12px;',
    '  font-weight: 600;',
    '}',
    '',
    '.ajax-alert.ajax-alert-sucess {',
    '  border-color: #71be47!important;',
    '  color: #71be47!important;',
    '  box-shadow: inset 0 0 80px rgba(113, 190, 71, 0.3);',
    '}',
    '',
    '.ajax-alert.ajax-alert-danger {',
    '  color: #e6594c!important;',
    '  border-color: #e6594c!important;',
    '  box-shadow: inset 0 0 0 80px rgba(226, 99, 88, 0.15);',
    '}',
  ].join('\n');
 
  $(function () {
 
    var $postingResult = $([
      '<div class="posting-results">',
      '</div>',
    ].join('\n'))
      .insertBefore('div#textarea_content')
    ;
 
    $('<style>', {
      type: 'text/css',
      text: ajaxPostingStyles
    }).appendTo('head');
 
    $('form#quick_reply')
      .on('submit', function (event) {
 
        if ($('textarea').sceditor('instance').val().length < ajaxPostingConfig.minForPost) {
          $postingResult
            .html([
              '<div class="ajax-alert ajax-alert-danger">',
              '  <div class="fa fa-exclamation-circle"></div>',
              '  <span>Para postar, sua mensagem deve ter no mínimo ' + ajaxPostingConfig.minForPost + ' caracteres.</span>',
              '</div>',
            ].join('\n'))
          ;
          return false;
        }
 
        if ($('textarea').sceditor('instance').val().length > ajaxPostingConfig.maxForPost) {
          $postingResult
            .html([
              '<div class="ajax-alert ajax-alert-danger">',
              '  <div class="fa fa-exclamation-circle"></div>',
              '  <span>Sua mensagem possui mais que o limite de caracteres (' + ajaxPostingConfig.maxForPost + ') para a postagem.</span>',
              '</div>',
            ].join('\n'))
          ;
          return false;
        }
 
        $.ajax({
 
          type: 'POST',
          url: '/post',
 
          data: {
            t: location.pathname.replace(/^\/t(\d+)-.*/gi, '$1'),
            mode: 'reply',
            tid: $('[name="tid"]').val(),
            post: 1,
            message: $('textarea').sceditor('instance').val(),
          },
 
          beforeSendo: function(context) {
            $postingResult
              .html([
              '<div class="ajax-alert ajax-alert-loading">',
                '  <div class="fa fa-circle-o-notch fa-spin"></div>',
                '  <span>Carregando...</span>',
                '</div>',
              ].join('\n'))
            ;
          },
 
          success: function(context) {
 
            var $link = $('a[href*="/viewtopic"]');
 
            $.get($link.attr('href'), function(context) {
              var $post = $('.post:last', context);
              $post
                .hide()
                  .insertAfter('.post:last')
                    .slideDown('fast', function() {
                      $('html, body').animate({
                          scrollTop: $('.post:last').offset().top
                      }, 500);
              });
            });
 
            // Adicionar alerta:
            $postingResult
              .html([
              '<div class="ajax-alert ajax-alert-sucess">',
                '  <div class="fa fa-check"></div>',
                '  <span>Mensagem postada com sucesso!</span>',
                '</div>',
              ].join('\n'))
            ;
 
            // Remover conteúdo do SCEditor:
            $('textarea').sceditor('instance').val('');
 
            console.info('[Postar em Ajax] {SUCESSO} ID do tópico onde fora postado o novo tópico: ' + location.pathname.replace(/^\/t(\d+)-.*/gi, '$1'));
 
          },
 
          fail: function(context) {
            $postingResult
              .html([
              '<div class="ajax-alert ajax-alert-danger">',
                '  <div class="fa fa-exclamation-circle"></div>',
                '  <span>Ocorreu um erro ao tentar postar sua mensagem. Tente esperar 10 segundos.</span>',
                '  <br />',
                '  <span>Caso o problema persista, acesse o Fórum dos Fóruns, e solicite ajuda.</span>',
                '</div>',
              ].join('\n'))
            ;
          },
        });
 
        event.preventDefault();
 
      })
    ;
  });
}(jQuery));

Até mais,
Fraise.

Continua o mesmo problema :/

Poderia checar se em Painel de Controle >> Geral >> Fórum >> Segurança tem a opção Não marcada em Desautorizar formulários não oficiais de postarem no fórum e enviar mensagens privadas.

Até mais,
Fraise.

Funcionou!


Muito obrigado, pode fechar! Resolvido