[jizzyfingers]

Originally Posted by DanInMa

<form id="form1" method="POST">
<input id="l" name="l" size="45" type="text" value="book">
<input id="submit" name="submit" value="save" type="submit">
</form>


<script>
$('#form1').submit(function(event){

event.preventDefault();

var formdata= $(this).serialize();//$(this) refers to the element you attached the submit function to  .serialize() prepares the values from the form for url submission and does most of the work for you
var carturl = '/content/pages/cart.php';//get your basic cart url

$.ajax({

type: "POST",

url : carturl,//get basic processing page url from variable

data: formdata,

success: function(msg){//msg is the html response from the page you just posted to

$("#contentmainpane").html(msg);//this changes the html to show the response

}
});
});
</script>

hope this makes sense.

ok also, you need to bear in mind some peopel actually do disable javascript. you should make your form work without ajax first. this includes giving your form an action attribute. I liek to do it that way then in your .ajax call you can do this

var $posttype = $(this).attr('method')
var $carturl = $(this).attr('action')

I just don't know how to use the form action to load another page inside the div #contentmainpane which is why I resorted to JS
I understand that some do disable JS but I guess these people cannot use a lot of sites.

Do you have an idea how to load a page within #contentmainpane div using the form action? I can only ever see the form action load _blank so a new window/tab loads the secondary page ?

I'm not keen on JS (allow the user turn it off) myself.