1

Boas pessoal, estou a desenvolver um southbox e estou aqui com um problema.. Eu quando escrevo algo no shoutbox e dou enter ou clico em enviar ele da refresh na pagina..

Deixo aqui o que já tenho ..

INDEX.PHP

/* PARTE DE CIMA DESTA PAGINA */
<?
require('../php/config/config.php');
require('../php/config/classes/framework.php');

$STH = $db->prepare("SELECT * FROM chat");
$STH->execute();
?>
/* PARTE DE CIMA DESTA PAGINA */



<div id="shouts" class="shouts">
                                                <div class="panel-body">
                                                    <ul class="list-group">
                                                        <?php while ($row = $STH->fetch(PDO::FETCH_ASSOC)) { ?>
                                                                <li class="list-group-item"><span><?php echo $row['time'] ?> - </span><strong><?php echo $row['user'] ?>:</strong> <?php echo $row['message'] ?></li>
                                                        <?php } ?>
                                                    </ul>
                                                </div>
                                            </div>
                                            <div class="panel-footer">
                                                <?php if (isset($_GET['error'])) { ?>
                                                        <div class="alert alert-danger">
                                                            <?php echo $_GET['error'] ; ?>
                                                        </div>
                                                <?php } ?>
                                                <form action="process.php" method="post">
                                                    <div class="row">
                                                        <div class="col-xs-12 col-sm-6">
                                                            <input type="text" class="form-control" name="user" placeholder="Enter Your Name">
                                                        </div>
                                                        <div class="col-xs-12 col-sm-6">
                                                            <input type="text" class="form-control" name="message" placeholder="Enter A Message">
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col-xs-12">
                                                            <input class="btn btn-primary shout-btn" type="submit" id="submit" name="submit" value="Shout It Out">
                                                        </div>
                                                    </div>              
                                                </form>


                                    </div>

PROCESS.PHP

<?php 

    require('../php/config/config.php');
    require('../php/config/classes/framework.php');

    //check if form submitted
    if (isset($_POST['submit'])) {

        $user = $_POST['user'];
        $message = $_POST['message'];

        $time = date('H:i:s');

        if (!isset($user) || $user == '' || !isset($message) || $message == '') {

            $error = "Please fill in your name and a message";
            header('Location: index.php?error='.urlencode($error));
            exit();

        } else {

            $STH = $db->prepare("INSERT INTO chat (user, message, time) VALUES (:user, :message, :time)");

            $STH->bindValue(':user', $user);
            $STH->bindValue(':message', $message);
            $STH->bindValue(':time', $time);

            $STH->execute();

            header('location: index.php');
            exit();
        }
    }

?>

Coloquei isto no index.php:

      <script>
$(document).ready(function(){

$('#submit').click(function(){

$.post("process.php").serialize(),  function(response) {
$('#shouts').reload;
});
return false;

});

});
</script>

Mas sem sucesso..

O meu objectivo era ao clicar ENTER ou no botão de SUBMIT enviar a mensagem automaticamente sem dar refresh na pagina..

1 Resposta 1

4

Tens um erro nesta linha:

$.post("process.php").serialize(), function (response) {

Os argumentos da função não estão corretos. A sintaxe correta é:

jQuery.post(url [, dados] [, fn sucesso] [, dataType ]);

Estás a usar return false; para parar o submit da form, eu prefiro e. preventDefault(); que é semanticamente mais correto.

Imagino que a tua form era submetida por causa do erro, sem ele acho que o código funcionaria e que o submit seria via ajax e sem refresh da página.

A minha sugestão de código seria:

$('#submit').click(function (e) {
    e.preventDefault();
    var data = $(this).serialize();
    $.post("process.php", data, function (response) {
        alert('ajax feito!');
        $('#shouts').reload; // repara esta linha não faz nada! seria talvez `.reload()`?
    });
9
  • Nao deu, ele faz refresh a pagina na mesma.. e o que queria q o reload fizesse era mal alguma mensagem fosse enviada fizesse refresh tanto nos computadores q recebem tanto como no que envia.. Tipo facebook...
    – thecreator
    Commented 30/06/2015 às 23:19
  • @thecreator ok, faltava um .closest('form') mas o refresh não devia acontecer. Dá uma olhada a este exemplo e usa o código como está lá -> jsfiddle.net/9ogrdhvs Se tiveres problemas vê a consola e diz-me se tem algum erro lá...
    – Sergio
    Commented 1/07/2015 às 5:22
  • Agora nao faz refresh tal como queria, mas nao manda nada para a base de dados..
    – thecreator
    Commented 1/07/2015 às 10:55
  • Condegues ver no developer tools o que é passado no request? O que dá var_dump($_POST); ?
    – Sergio
    Commented 1/07/2015 às 12:16
  • não percebi isso do developer tools.. estou a fazer isso no xampp.. e daqui a uns 20 min chego a casa e faço var_dump a isso. desde já muito obrigado pela ajuda e paciência !
    – thecreator
    Commented 1/07/2015 às 14:53

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .