Question

I have the following html form

<form action="/newPost" id="submit_new" method="get"><div class="iwill">
    <div class="iwill-holder">
        <div class="txt"></div><div class="f"><input class="text" id="quickpost" name="quickpost" type="text" value=""></div>
        <div class="img regularProgress" alt="Processing..."><input alt="Continue" class="iwill-btn movable" id="continue_submit" src="<?=$config['http']?>images/btn-2-continue-gray.png" type="image"></div>
    </div>
</div>
</form>

and here is the jquery function :

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

var error = 0;

    var quickpost = $("#quickpost").val();
    if( quickpost == '' ) {
    $("#quickpost").effect("shake", { times:3 }, 50);
    $('#quickpost').css("color","red");
    $('#quickpost').css("border","red 1px solid");
    error = 1;

    }else{
      $('#quickpost').css("border","gray 1px solid");
      $('#quickpost').css("color","black");
      error = 0;
    }


    if(errorCounter > 0){
      return false;
    }else{

        $.ajax({
                  url: 'sendPost.php?quickpost='+quickpost,
                  success: function(data) {
                    $('#result').prepend(data).slideDown('slow', function() {});

                  }
                });
    }
    return false;
});

technically I am trying to post the form values using ajax, but whatever I do the form still gets submitted to action page. I have tried to even make all paths lead to false but its not working

Answer 1

Try preventing the default behavior

$('#submit_new').click(function(e) {
e.preventDefault();
...

You also have a typo

if(errorCounter > 0){
    return false;
}else{

should be:

if(error > 0){
    return false;
}else{