Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
JS de envio de mensagem sem refresh com funcionamento alternado
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
JS de envio de mensagem sem refresh com funcionamento alternado
Detalhes da questão
Endereço do fórum: http://pokemonillium.forumeiros.com
Versão do fórum: phpBB3
Descrição
Olá, estive a utilizar o seguinte código:
- 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, .posting-load {' +
' -moz-box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
' -webkit-box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
' box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
' display: block;' +
' font-size: 12px;' +
' line-height: 1.6;' +
' padding: 10px;' +
'}' +
'.alert-success {' +
' background-color: #40a930;' +
' color: #ffffff;' +
' width: 70%;' +
' margin: auto;' +
' margin-bottom: 10px;' +
' text-align: center;' +
' border-radius: 10px;' +
' padding: 15px;' +
'}' +
'.alert-error {' +
' background-color: #d63939;' +
' color: #ffffff;' +
' width: 70%;' +
' margin: auto;' +
' margin-bottom: 10px;' +
' text-align: center;' +
' border-radius: 10px;' +
' padding: 15px;' +'}' +
'.posting-load {' +
' background-color: #36b1f1;' +
' color: #ffffff;' +
' width: 70%;' +
' margin: auto;' +
' margin-bottom: 10px;' +
' text-align: center;' +
' border-radius: 10px;' +
' padding: 15px;' +'}' +
'</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 = 5; // 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("Postando...").attr("class", "posting-load");
},
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;
});
});
No entanto, percebi que o mesmo começou a apresentar um mal funcionamento, este que consiste no botão pre-visualizar, estar enviando as mensagens ao invés de exercer sua real função.
Re: JS de envio de mensagem sem refresh com funcionamento alternado
Não é mau funcionamento do script. É que da forma como esse script foi feito, não há como diferenciar o botão de enviar com o de pré-visualizar.
Troque por este:
o/
Troque por este:
- 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, .posting-load {' +
' -moz-box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
' -webkit-box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
' box-shadow: rgba(0,0,0,0.1) 0 1px 3px;' +
' display: block;' +
' font-size: 12px;' +
' line-height: 1.6;' +
' padding: 10px;' +
'}' +
'.alert-success {' +
' background-color: #40a930;' +
' color: #ffffff;' +
' width: 70%;' +
' margin: auto;' +
' margin-bottom: 10px;' +
' text-align: center;' +
' border-radius: 10px;' +
' padding: 15px;' +
'}' +
'.alert-error {' +
' background-color: #d63939;' +
' color: #ffffff;' +
' width: 70%;' +
' margin: auto;' +
' margin-bottom: 10px;' +
' text-align: center;' +
' border-radius: 10px;' +
' padding: 15px;' +'}' +
'.posting-load {' +
' background-color: #36b1f1;' +
' color: #ffffff;' +
' width: 70%;' +
' margin: auto;' +
' margin-bottom: 10px;' +
' text-align: center;' +
' border-radius: 10px;' +
' padding: 15px;' +'}' +
'</style>'
);
var hrefResposta = $("a[href^='/post?t=']").attr("href");
var form = $("#quick_reply");
$("<div id='resultados_ajax'></div>").prependTo(form);
$("#quick_reply").find('[name="post"]').click(function(ev) {
ev.preventDefault();
var form = $(this).parents('form');
var resAjax = $("#resultados_ajax"); // Elemento resultados_ajax
var textEditorVal = $("textarea").sceditor("instance").val(); // Valor do editor
var min = 5; // 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("Postando...").attr("class", "posting-load");
},
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;
});
});
o/
Re: JS de envio de mensagem sem refresh com funcionamento alternado
Que estranho, eu devo ter mexido em algo quando criei a variável para personalizar o "Postando..." porque inicialmente estava funcionando normal kkk
Obrigado Luiz, resultou.
Obrigado Luiz, resultou.
Re: JS de envio de mensagem sem refresh com funcionamento alternado
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para Questões resolvidas. |
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217
Tópicos semelhantes
» Mensagem de Refresh
» Envio de mensagem privada automaticamente
» Postar sem refresh
» Problema com envio de mensagens: "Esta mensagem não existe"
» Responder sem refresh
» Envio de mensagem privada automaticamente
» Postar sem refresh
» Problema com envio de mensagens: "Esta mensagem não existe"
» Responder sem refresh
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre códigos Javascript e jQuery
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos