Is it possible to get multiple forms to work with one ajax post function

Posted by Scarface on Stack Overflow See other posts from Stack Overflow or by Scarface
Published on 2010-05-14T16:02:48Z Indexed on 2010/05/14 16:04 UTC
Read the original article Hit count: 162

Filed under:

Hey guys I have a system where there is one form for each friend you have and I used to have an ajax post function for each form, but I want to save code and was wondering if it was possible to get multiple forms to work with just one post function. If anyone has any advice on how to achieve this I would appreciate it. For example

<div id="message">
     <form id='submit' class='message-form' method='POST' > 
      <input type='hidden' id='to' value='friend1' maxlength='255' >   
      Subject<br><input type='text'  id='subject' maxlength='50'><br>
       Message<br><textarea id='message2' cols='50' rows='15'></textarea>
       <input type='submit' id='submitmessage' class='responsebutton' value='Send'> 
    </form>
</div>


$(document).ready(function(){
$(".message-form").submit(function() {
 $("#submitmessage").attr({ disabled:true, value:\"Sending...\" });

var to    = $('#to').attr('value');
var subject    = $('#subject').attr('value');
var message    = $('#message2').attr('value');

$.ajax({
type: "POST",
url: "messageprocess.php",
data: 'to='+ to + '&subject=' + subject + '&message=' + message,
success: function(response) {
if(response == "OK") {
$('.message-form').html("<div id='message'></div>");
$('#message').html("<h2>Email has been sent!</h2>")
        .append("<p>Please wait...</p>")
        .hide()
        .fadeIn(1500, function() {
          $('#message').append(\"<img id='checkmark' src='images/check.png' />\");
        });

© Stack Overflow or respective owner

Related posts about jQuery