tengo armado este form con .js y .php pero necesito modificarlo para que cuando la consulta sea enviada haga un redirect a una thankyou.html. La verdad que de ajax y js conozco muy poco y estoy necesitando ayuda. Les dejo lo que tengo armado, funciona perfectamente, solo me falta que el redireccionamiento.
<form role="form" method="post" id="reused_form" enctype="multipart/form-data">
<input type="text" id="name" name="name" maxlength="256" placeholder="Nombre y Apellido" class="text-field w-input" required>
<input type="email" id="email" name="email" placeholder="Email" maxlength="256" class="text-field w-input" required>
<input type="text" id="tel" name="tel" placeholder="Teléfono" maxlength="256" class="text-field w-input" required>
<textarea name="message" id="message" placeholder="Mensaje" maxlength="5000" class="textarea w-input"></textarea>
<label for="file-upload" class="custom-file-upload">
<i class="material-icons">cloud_upload</i><span style="position: absolute;margin: 4px 12px">etc etc</span>
<input type="file" id="image" name="image" >
</label>
<button type="submit" class="submit-button" id="btnContactUs" style="color:#fff">Enviar consulta</button>
</form>
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
require_once './vendor/autoload.php';
use FormGuide\Handlx\FormHandler;
$pp = new FormHandler();
$validator = $pp->getValidator();
$validator->fields(['name','email'])->areRequired()->maxLength(50);
$validator->field('email')->isEmail();
$validator->field('message')->maxLength(6000);
$pp->attachFiles(['image']);
$pp->sendEmailTo('[email protected]'); // ← Your email here
echo $pp->process($_POST);
$(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 ...');
});
var formdata = new FormData(this);
$.ajax({
type: "POST",
url: 'handler.php',
data: formdata,
success: after_form_submitted,
dataType: 'json' ,
processData: false,
contentType: false,
cache: false
});
});
});