Eric
Eric

Reputation: 2231

Jquery ajax not refreshing in modal

I'm using a fancybox modal to display comments from a news page pulled from a mysql database. The modal also has a section that allows users to post new comments. I'm using jquery to send the form information to another script for processing.

Instead of returning the successful message, it's posting the information and redirecting to the page instead of displaying the information in the modal.

Here's the jquery that should cause this to happen:

$(document).ready(function(){ 
$("#submit").click(function() {
/* Set some vars */
                        var messageText = $("textarea#message").val();
                        var newsID = $("hidden#newsid").val();


                        $.post('/process/newmsg.php',
                            { message : messageText, newsid: newsID },
                            function(data) {
                                $("#fancybox_content").before(data);
                            }
                        );



});

});

Any idea what I'm missing here?

Upvotes: 0

Views: 299

Answers (3)

gilly3
gilly3

Reputation: 91497

Assuming #submit is a submit button, you need to cancel the default behavior of that button, which is to submit the form. Either return false from your click handler function or use e.preventDefault().

Upvotes: 0

Johnny Craig
Johnny Craig

Reputation: 5002

Try $("#fancybox_content").html(data);

before() wont put the result INSIDE the fancybox_content, it will put it before it.

also, if the result is a full html document including the head and everything, it will cause problems. you should parse the results first

Upvotes: 0

Claudio
Claudio

Reputation: 5980

this is not a valid selector: $("hidden#newsid"). So, "newsID" is empty and the post parameters give syntax error

{ message : messageText, newsid: },

Upvotes: 1

Related Questions