yarek
yarek

Reputation: 12064

jQuery form submit

My goal is: When for is submitted:

Infact the trouble is, I cannot submit the form since there is a jquery submit event on it!

function form1Submit() {
var username=$('#username').val();
var password=$('#password').val();
if (username.length<2) {
    return false;
}
if (password.length<2) {
    return false;
}
$.post("check.php", { username: username, password:password }, function(data) {
    if (data=="ko") {
        alert('bad password');
        return false;
    } else {
    //to be done here !
    }
});
    return false;
}
function init() {
   $('#form1').submit(function(){
        return form1Submit();
    })
}
$(document).ready(function(){
    init();
})

Upvotes: 13

Views: 29959

Answers (5)

Gaurav Maharwal
Gaurav Maharwal

Reputation: 7

$(function() {

        $("#search_form").validate({
            rules: {
                class_id: {
                    required:true,
                },
                section_id: {
                    required:true,
                },
                period_id: {
                    required:true,
                },
            },
            messages:{
                class_id: {
                    required:'Class id is required',
                },
                section_id: {
                    required:'Section id is required',
                },
                period_id: {
                    required:'Month is required',
                }
            },
            submitHandler: function(form) {

               //Your ajax code
               return false;
           }
        });

    });

Upvotes: -1

Nick Craver
Nick Craver

Reputation: 630607

You can call the native submit event, so do this:

$('#form1').submit(form1Submit);

Then in your post callback do this:

$.post("check.php", { username: username, password:password }, function(data) {
    if (data=="ko") {
        alert('bad password');
    } else {
        this.submit();
    }
});

The this.submit() isn't calling he jQuery .submit() trigger function, but rather the native <form> .submit() function.

Upvotes: 10

andres descalzo
andres descalzo

Reputation: 14967

function form1Submit(ev, ok) {

  ev.stopPropagation();

  ok = (typeof ok != 'undefined') ? ok : false;

  if (ok)
    return true;

  var username=$('#username').val(),
      password=$('#password').val(),
      selfForm = this;

  if (username.length < 2)
    return false;

  if (password.length < 2)
    return false;

  $.post("check.php", { username: username, password:password }, function(data) {
    if (data=="ko") {
      alert('bad password');
    } else {
      $(selfForm).trigger('submit', [true]); // again submit but with ok parameter
    }
  });

  return false;
}

function init() {
   $('#form1').bind('submit', form1Submit);
}

$(document).ready(function(){
    init();
})

Upvotes: 1

A. M.
A. M.

Reputation: 565

The problem is that form1Submit always returns false.

Upvotes: 1

BalusC
BalusC

Reputation: 1109655

The return false is blocking the default form submit action. You have either to return true from the form1Submit() function to let the default form submit action do its job, or to add another $.post() inside the else which submits the data to the form asynchronously, if your intent was to do it using ajaxical powers.

Upvotes: 1

Related Questions