Zanima me koje sve načine koristite prikazati messages od formi?
Problem: User koristi krivi input, submita, stranica se refresha( php server side validacija), i user dobija poruke o neispravnom inputu.
Ovo je forma:
Code:
<form class="" action="" method="post" id="signup-form">
<div class="title-box" id="title-box-signup">
<h2>Sign Up</h2>
</div>
<div class="input-box" id="input-box-signup-user">
<input type="text" name="username" value="" placeholder="Username">
</div>
<div class="input-box" id="input-box-signup-password">
<input type="password" name="password" value="" placeholder="Password">
</div>
<div class="input-box" id="input-box-signup-email">
<input type="email" name="email" value="" placeholder="Email">
</div>
<div class="form-action" id="form-action-signup">
<button type="submit" name="submit" id="signup-submit">Sign Up</button>
</div>
<div class="form-content">
<p>By clicking Sign Up, you agree to our Terms and Conditions and that you have read our Privacy Policy, including our Cookie Usage.<br><span>You can opt out at any time.</span></p>
</div>
</form>
Želim postići pri submitu stranica se ne refresha, nego samo prikazuje poruke od forme.
Hvala na pomoći, koristim jquery library, može i vanilla js.
Više sam php orijentiran i pokušavam nešto tipa :
Code:
$('form').submit(function(event) {
// get the form data before sending via ajax
var formData = {
'name' : $('input[name=name]').val(),
'number' : $('input[name=number]').val(),
'message' : $('input[name=message]').val(),
'contactSubmit' : 1
};
// send the form to your PHP file (using ajax, no page reload!!)
$.ajax({
type: 'POST',
url: 'file.php', // <<<< ------- complete with your php filename (watch paths!)
data: formData, // the form data
dataType: 'json', // how data will be returned from php
encode: true
})
// JS (jQuery) will do the ajax job and we "will wait that promise be DONE"
// only after that, we´ll continue
.done(function(data) {
if(data.success === true) {
// show the message!!!
$('#success').show();
}
else{
// ups, something went wrong ...
alert('Ups!, this is embarrasing, try again please!');
}
});
// this is a trick, to avoid the form submit as normal behaviour
event.preventDefault();
});
});
Ali bezuspiješno.
Hvala na pomoći
p.s.
Aplikacija koja se radi na laravel, ovo je signup.blade.php unutar components foldera.
Mislio sam bacit reserach na :
socket.io ali koristiti socket samo za form validaciju na kraju se ispostavilo kao vulnerability i overkill za tako nešto.