javascript - Form Validation laravel -
alright , made form validation , okay , when want connect validation in laravel use way
this pages controller
public function getcontact(){ self::$data['title'] = 'contact us'; return view('content.contact',self::$data); } public function postcontact(test $request){ } } this routes :
route::get('contact','pagescontroller@getcontact'); route::post('contact', 'pagescontroller@postcontact'); and form
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script type="text/javascript" href="{{asset('js/class.formvalidation.js')}}"></script> <script type="text/javascript" href="{{asset('js/landin_validation.js')}}"></script> <link rel="stylesheet" type="text/css" href="{{asset ('js/style.css')}}"/> </head> <body> <form action="" method="post" class="landing-form"> {!! csrf_field() !!} <label>fill details here - </label><br/><br/> <input placeholder="full name:" type="text" name="name" class="field-name" /> <input placeholder="email:" type="text" name="email" class="field-email" /> <input placeholder="phone number:" type="text" name="phone" class="field-phone" /> <input type="submit" name="submit" value="send" /> okay , tried lot connect validation form , since it's laravel know requests way tried lot connect validation doesnt work ,
this landin_validation.js
var formvalidate = new formvalidation(); $(document).ready(function () { $('form.landing-form').submit(function () { // collect client info fields var name = $.trim( $('input[type="text"].field-name').val() ); var email = $.trim( $('input[type="text"].field-email').val() ); var phone = $.trim( $('input[type="text"].field-phone').val() ); // reset input fields error class $('input[type="text"]').removeclass('error'); // form validation if (!formvalidate.testname(name) ) { $('input[type="text"].field-name').addclass('error'); $('input[type="text"].field-name').val(''); $('input[type="text"].field-name').attr('placeholder', '* valid full name required!'); } else if ( !formvalidate.testemail(email) ) { $('input[type="text"].field-email').addclass('error'); $('input[type="text"].field-email').val(''); $('input[type="text"].field-email').attr('placeholder', '* valid email required!'); } else if ( !formvalidate.testphone(phone) ) { $('input[type="text"].field-phone').addclass('error'); $('input[type="text"].field-phone').val(''); $('input[type="text"].field-phone').attr('placeholder', '* valid phone required!'); } else { // open ajax call save client details + send mail customer $.ajax({ url: "form_handler.php", type: "post", datatype: "html", async: "false", data: {name: name, email: email, phone: phone}, beforesend: function () { var messege = '<img src="ajax-loader.gif" border="0">'; messege += ' sending... '; $('form.landing-form label').html(messege); }, success: function (response) { if (response == true) { settimeout(function(){ $('div.form-wrapper').html('<label>your details has been send!</label>'); }, 2000); } else { $('div.form-wrapper').html('<label>something went wrong, please try again later...</label>'); } } }); } // stop form submission return false; }); }); and formvalidation.js
function formvalidation(){ this.namereg = [ /^([a-za-z\s]+){2,255}$/ ]; this.emailreg = [ /^[_a-z0-9-]+(.[_a-z0-9-]+)*@[a-z0-9-]+(.[a-z0-9-]+)*(.[a-z]{2,3})$/ ]; this.phonereg = [ /^[0-9]{3}-[0-9]{3}-[0-9]{4}$/i, /^[0-9]{3}.[0-9]{3}.[0-9]{4}$/i, /^\([0-9]{3}\)-[0-9]{3}-[0-9]{4}$/i, /^[0-9]{9,10}$/i ]; this.testname = function( nameinput ){ return this.inputcheck(this.namereg, nameinput); }; this.testemail = function( emailinput ){ return this.inputcheck(this.emailreg, emailinput); }; this.testphone = function( phoneinput ){ return this.inputcheck(this.phonereg, phoneinput); }; this.inputcheck = function( regarray, inputdata ){ var valid = false; $.each( regarray, function( key, val ){ if( val.test( inputdata ) ){ valid = true; } }); return valid; }; } i want know way connect form validation.
i think it's not idea validate form data js.Аccording me should validate server-side.if want have user experience can use javascript lib - http://t4t5.github.io/sweetalert/
Comments
Post a Comment