聊天表格未提交

Question

i'm working on a php chat and everything work good but i wanted ajax for stoping the refresh page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(document).ready(function () {
    $("#submit").on("click", function (event) {
        event.preventDefault();
        $.ajax({
            type: "POST",
            url: "index.php",
            data: $("#chat").serialize(),
            success: function () {
                alert('lorem ipsum');
            }
        });
    });
});
</script>

<form name="chat" action="" method="post" id="chat">
<b>Msg:</b>
<input type="text" name="msg" size="30" class="text">
<input type="submit" name="submit" value="Send!" class="bttn" id="submit">
<input type="hidden" name="lastcat" value="<?php echo $simplecat; ?>">
<input type="hidden" name="lastwas" value="<?php echo $command; ?>">
</form>

 <hr>
 <div class="leftalign">
  <b class="yousay">You say:</b> <?php echo stripslashes($usermessage); ?><br /><br />

 <b class="catsays">Cat replies:</b> <?php echo $catreply;?><br /><br />

i see the msg box and the page wont refresh but my $_POST['msg'] is empty so what i missed?

Answer 1

You aren't very clear where your message should go, but this should fix it...to some degree:

page1.php

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(document).ready(function () {
    $("#submit").on("click", function (event) {
        event.preventDefault();
        $.ajax({
            type: "POST",
            url: "index.php",
            data: $("#chat").serialize(),
            success: function (response) {
                alert('lorem ipsum');
                // You need somewhere to drop the response into.
                // I've chosen the id "response"
                $("#response").html(response);
            }
        });
    });
});
</script>

<form name="chat" action="" method="post" id="chat">
<b>Msg:</b>
<input type="text" name="msg" size="30" class="text">
<input type="submit" name="submit" value="Send!" class="bttn" id="submit">
<input type="hidden" name="lastcat" value="<?php echo $simplecat; ?>">
<input type="hidden" name="lastwas" value="<?php echo $command; ?>">
</form>
<hr>
<div class="leftalign">
    <!-- I replaced your php response with where the AJAX should drop in -->
    <b class="yousay">You say:</b><div id="response"></div><br /><br />
    <b class="catsays">Cat replies:</b> <?php echo $catreply;?><br /><br />

index.php

<?php if(isset($_POST['msg'])) { print_r($_POST); return; } ?>