Multiple AJAX forms

Multiple AJAX forms

 Hello,

I have developed the following jQuery script...

   
  1.   // POST Forms

    $('#POSTformbutton').livequery('click', function() {

    $("#contentmain").hide();


    //var username = $("input#username").val();  

    //var password = $("input#password").val();  

    //var dataString = 'username='+ $('input#username').attr("value") + '&password=' + $('input#password').attr("value");

    var dataString = $("form").serialize();


    $.ajax({

    type: "POST", url: $("input#url").val(), data: dataString,

    async: true,

    beforeSend: function(){$("#loading").show("fast");},

    complete: function(){$("#loading").hide();},

    success: function(html){ //so, if data is retrieved, store it in html

    $("#contentmain").show(); //animation

    $("#contentmain").html(html); //show the html inside .content div

      },

    error: function(xhr, ajaxOptions, thrownError){

    $("#contentmain").fadeIn("slow");

    $("#contentmain").html('<p style="color: red; background-color: black; border: 1px solid red; padding: 2px;">ERROR: Page does not exist!</p>');

                }    

    });

    $.ajax({

    type: "POST", url: 'rightpanel.php',

    async: true,

    success: function(html){$("#right").html(html);}

    });

    $.ajax({

    type: "POST", url: 'leftpanel.php',

    async: true,

    success: function(html){$("#left").html(html);}

    });

    });


I use this for every form on my website, however if I have a page with more than 1 HTML form, than this just doesn't work for several, and I have no idea how I can change this to work for several forms on the 1 page.

Any help, suggestions or resources are really appreciated!

Thanks, Ace