I have a form such as :
<form action='???' method='post' name='contact'>
<input type="text" class="inputContact" name="mittente" />
<textarea class="textContact" name="smex"></textarea>
<input type="submit" value="Send" />
</div>
</form>
I'd like to send these data asynchronously, trought jQuery function $.ajax.
EDIT :with solution :
<form name='contactForm'>
<input type="text" class="inputContact" name="mittente" />
<textarea class="textContact" name="smex"></textarea>
<input type="submit" value="Send" />
</form>
<script type="text/javascript">
$(document).ready(function() {
$('form[name=contactForm]').submit(function(e){
e.preventDefault();
$.ajax({
type: 'POST',
cache: false,
url: './ajax/header_ajax.php',
data: 'id=header_contact_send&'+$(this).serialize(),
success: function(msg) {
$("#boxContentId").html(msg);
}
});
});
});
</script>
$('form[name=contact]').submit(function(){
// Maybe show a loading indicator...
$.post($(this).attr('action'), $(this).serialize(), function(res){
// Do something with the response `res`
console.log(res);
// Don't forget to hide the loading indicator!
});
return false; // prevent default action
});
See: