CODEWITHSUNDEEP
javascriptjquery
Parag
Parag

Reputation: 4812

Form submit using jquery & passing values

I want to accomplish the following using jQuery:

frm_rooms.action="create_rooms.php?action=Save";
frm_rooms.submit();

I tried following jQuery but it doesn't work:

$('#frm_rooms').submit(function(event) <br/>{
    $.post("create_rooms.php", { action: "Save" } );
});

Upvotes: 1

Views: 5996

Answers (5)

Alex Pliutau
Alex Pliutau

Reputation: 21947

You can add .click() method to your button:

$('#button').click(function() {
   //...
   $('#form').attr('action', 'action.php');
   return false;
})

Upvotes: 0

MD Sayem Ahmed
MD Sayem Ahmed

Reputation: 29186

Try this - 

$('#frm_rooms').submit(function(event)
{
    $.post("create_rooms.php", {action: "Save" } );
    event.preventDefault();
});

If you have an input element of type submit inside that form, then this method won't work. In that case, you will have to do something like following - 

$('#mySubmitButton').click(function(event)                 // Suppose the id of that 
                                                           // submit button is mySubmitButton
{
    $.post("create_rooms.php", {action: "Save" } );
    event.preventDefault();
});

If you want to provide success/failure message to the user, then modify the $.post method like this - 

$.post("create_rooms.php", {action: "Save" }, function(data)
{
    // data contains server response. 
});

Upvotes: 0

Edgar Villegas Alvarado
Edgar Villegas Alvarado

Reputation: 18354

Do it like this:

$('#frm_rooms').submit(function(event){
  $.post("create_rooms.php", {action: "Save" }, function(){ 
     alert("Data saved");
  });
  return false; //This is vital
});

If you want the parameters to be passed in the query string (GET method) use $.get instead of $.post.

EDIT: Thinking better, if you have fields inside your form that you want to be submitted, you should do:

$('#frm_rooms').submit(function(event){
  $.post("create_rooms.php?action=Save", $(this).serialize(), function(){ 
     alert("Data saved");
  });
  return false; //This is vital
});

Hope this helps. Cheers

Upvotes: 3

Alex Pliutau
Alex Pliutau

Reputation: 21947

Add return false; after $.post() to avoiding page reloading.

Upvotes: 0

Fidi
Fidi

Reputation: 5824

Have you tried to use preventDefault() in your submit-function?

$('#frm_rooms').submit(function(event)
{
    event.preventDefault();
    $.post("create_rooms.php", { action: "Save" } );
});

Also be aware that if you also have an input-element within your form, which name is 'submit'. The submit-method of jQuery won't work.

Upvotes: 0

Related Questions