74 lines
1.9 KiB
Markdown
74 lines
1.9 KiB
Markdown
|
# Formtest
|
||
|
|
||
|
<form method="post" name="myemailform" action="form-to-email.php">
|
||
|
<p>Enter Name: <input type="text" name="name"></p>
|
||
|
<p>Enter Email Address: <input type="text" name="email"></p>
|
||
|
<p>Enter Message: <textarea name="message"></textarea></p>
|
||
|
<input type="submit" value="Send Form">
|
||
|
</form>
|
||
|
|
||
|
<script>
|
||
|
$(function()
|
||
|
{
|
||
|
function after_form_submitted(data)
|
||
|
{
|
||
|
if(data.result == 'success')
|
||
|
{
|
||
|
$('form#reused_form').hide();
|
||
|
$('#success_message').show();
|
||
|
$('#error_message').hide();
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
$('#error_message').append('<ul></ul>');
|
||
|
|
||
|
jQuery.each(data.errors,function(key,val)
|
||
|
{
|
||
|
$('#error_message ul').append('<li>'+key+':'+val+'</li>');
|
||
|
});
|
||
|
$('#success_message').hide();
|
||
|
$('#error_message').show();
|
||
|
|
||
|
//reverse the response on the button
|
||
|
$('button[type="button"]', $form).each(function()
|
||
|
{
|
||
|
$btn = $(this);
|
||
|
label = $btn.prop('orig_label');
|
||
|
if(label)
|
||
|
{
|
||
|
$btn.prop('type','submit' );
|
||
|
$btn.text(label);
|
||
|
$btn.prop('orig_label','');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
}//else
|
||
|
}
|
||
|
|
||
|
$('#reused_form').submit(function(e)
|
||
|
{
|
||
|
e.preventDefault();
|
||
|
|
||
|
$form = $(this);
|
||
|
//show some response on the button
|
||
|
$('button[type="submit"]', $form).each(function()
|
||
|
{
|
||
|
$btn = $(this);
|
||
|
$btn.prop('type','button' );
|
||
|
$btn.prop('orig_label',$btn.text());
|
||
|
$btn.text('Sending ...');
|
||
|
});
|
||
|
|
||
|
|
||
|
$.ajax({
|
||
|
type: "POST",
|
||
|
url: 'handler.php',
|
||
|
data: $form.serialize(),
|
||
|
success: after_form_submitted,
|
||
|
dataType: 'json'
|
||
|
});
|
||
|
|
||
|
});
|
||
|
});
|
||
|
</script>
|