CODEWITHSUNDEEP
javascriptajaxformsjquery
fibi
fibi

Reputation: 149

Jquery Ajax Submit a form when i click a button which not been in the form

I have this code:

$(document).on('submit','#roomsend',function(e) {
   var form = $('#roomsend');
   var data = form.serialize();
   $.post('php/roomlist.php', data, function(response) {
      console.log(response);
      $('#power').replaceWith(response);
   });
   return false;
});

This works with a Submit button inside the form. But now I have a button outside the form:

<button class="btn btn-success" id="roomsendbutton"><i class="icon-ok"></i> Save</button>

How must I must be the code, that when i clicked the button the button all actions will be work and the form submits?

Upvotes: 0

Views: 9491

Answers (4)

Kevin B
Kevin B

Reputation: 95054

If you're using HTML5, you can use the new form attribute:

<button form="roomsend" type="submit" class="btn btn-success" id="roomsendbutton"><i class="icon-ok"></i> Save</button>

http://jsfiddle.net/sEHLf/

Should probably look up browser support for it though.

Upvotes: 4

Maresh
Maresh

Reputation: 4712

$(document).on('click','#roomsendbutton',function(e) {
   var form = $('#roomsend');
   var data = form.serialize();
   $.post('php/roomlist.php', data, function(response) {
      console.log(response);
      $('#power').replaceWith(response);
   });
   return false;
});

Just bind the click event on the button.

Upvotes: 0

rjg132234
rjg132234

Reputation: 620

Just do something like this in your jQuery..

$('#roomsendbutton').click(function(){
     $(your form name).trigger('submit');

});

Upvotes: 0

user1823761
user1823761

Reputation:

Use .trigger() method:

$('#roomsendbutton').on('click', function () {
    $('#roomsend').trigger('submit');
});

References:

Upvotes: 2

Related Questions