Question

I am using php/ajax to submit a form without page refresh. Here are my files-

coupon.js

jQuery(document).ready(function(){
        jQuery(".appnitro").submit( function(e) {
$.ajax({
            url     : "sms.php",
            type    : "post",
            dataType: "json",
            data    : $(this).serialize(),
            success : function( data ) {
                        for(var id in data) {
                            jQuery('#' + id).html( data[id] );
                        }
                      }

        });
//return false or
e.preventDefault();

    });

});

sms.php

    <?php
    //process form
$res = "Message successfully delivered";
    $arr = array( 'mess' => $res );
    echo json_encode( $arr );//end sms processing
    unset ($_POST);
    ?>

and here is code for my html page –

<form id="smsform" class="appnitro" action="sms.php" method="post">
...
</form>
<div id="mess" style="background:green;"></div>

Now instead of submitting form through ajax without page refreshing what is happening is that page gets redirected to

baseurl/sms.php and the only thing visible on page is

{"mess":"Message successfully delivered"}

My guess is that php script is not returning back successfully to the jquery and hence the echo in last part of sms.php is getting displayed. How should i make the php script return successfully?
ANY IDEAS HOW TO DEBUG THIS.I HAVE TRIED USING return false at the end of coupon.js but no results.

When i click on submit firebug gives following results –

POST http://174.132.194.155/~kunal17/devbuzzr/wp-content/themes/street/sms.php

404 Not Found 1.29s   `jquery.min.js (line 130)`

Response

Firebug needs to POST to the server to get this information for url:
http://174.132.194.155/~kunal17/devbuzzr/wp-content/themes/street/sms.php

This second POST can interfere with some sites. If you want to send the POST again, open a new tab in Firefox, use URL 'about:config', set boolean value 'extensions.firebug.allowDoublePost' to true
This value is reset every time you restart Firefox This problem will disappear when https://bugzilla.mozilla.org/show_bug.cgi?id=430155 is shipped

Answer 1

@Fanis It’s irrelevant whether he uses ‘$’ or ‘jQuery’, they are synonyms.

@Ayush
As Fanis says, you should try Firebug if you don’t use it already.
I’ve checked the example at my server, works OK, and I don’t know
what’s the problem at Your side.

You can use onsubmit=”return false” to disable form submission:

<form id="..." class="..." ... onsubmit="return false">

Also check if javascript is enabled, for example do “alert(‘something’)”
at $(document).ready

Edit:

// instead of  
url: "sms.php"
// try
url: "/~kunal17/devbuzzr/wp-content/themes/street/sms.php"
// although I don't really know if it will help