Q:

AJAX POST DATA NOT WORKING

This is my jQuery-Ajax code:
<script>
    $('#sbmt').click( function(){
        $.ajax({
        type: 'post',
        data: $("#ajxfrm").serialize(),
        url: "postdata.php",
        cache: false,
        success: function (data)
        {
          alert('updated table');
        }
        });
    });
</script>

HTML CODE: 
<form id="ajxfrm" method="post" action=""> 

<label>HIGH :  </label>  <input type="text" name="hi"  id="hi"><br><br>

<label>LOW :  </label><input type="text" name="lo"  id="lo"><br><br>

<label>OPENING STOCK :  </label><input type="text" name="opn" id="opn"><br><br>

<label>CLOSING STOCK :  </label><input type="text" name="cls" id="cls">

<input type="submit" value="Submit" id="sbmt">

</form>

AND PHP CODE ON postdata.php file is :
require_once 'config.php';

$hi  = $_POST['hi'];

$lo = $_POST['lo'];

$opn = $_POST['opn'];

$cls = $_POST['cls'];

echo $hi;

$postdata = "INSERT INTO htmdem ( high,low,open,close ) VALUES('$hi','$lo','$opn','$cls');";

mysql_query($postdata);

When posting via form without ajax the table is getting updated as it should, but while using AJAX its not. Please suggest what's wrong here. Many Thanks

A:

Try this : Dont forget to set the form action to postdata.php
jQuery(function($) {
    $('#ajxfrm').submit( function(e){
        $.ajax({
            type: 'post',
            data: $(this).serialize(),
            url: $(this).attr("action")
        })
                .done(function (data){
                    alert('updated table');
                });
        e.preventDefault();
    });
});

