i have form in have 2 fields, ssn , phone. user enter of field. i'm using semantic validation, here code, can please let me know how validate form using semantic?
<form class="ui error form basic segment" role="form" method="post" action="{{ url('/username/email') }}"> <input type="hidden" name="_token" value="{{ csrf_token() }}"> <input type="hidden" name="_method" value="patch"> <div class="ui info message"> please enter either ssn or phone email username. </div> <div class="field"> <label for="ssn">ssn</label> <div class="ui icon input"> <input type="text" class="form-control" name="ssn" value="{{ old('ssn') }}"> </div> </div> <div class="field"> <label for="phone">phone</label> <div class="ui icon input"> <input type="text" class="form-control" name="phone" value="{{ old('phone') }}"> </div> </div> <input type="submit" value="email username" class="ui primary button"> </form> <script type="text/javascript"> $('.ui.form') .form({ inline : true, on: 'blur', fields: { username: { identifier : 'ssn', rules: [ { type : 'empty', prompt : 'please enter ssn' } ] }, } }) ; </script> `
i create semantic ui custom validation function accepts parameters purpose. here's link: http://jsfiddle.net/owcfuhtq/
the code:
$(document).ready(function(){ // function check if @ least 1 text not empty collection of elements // text value of input device // csv argument string. it's string inside "[" , "]" $.fn.form.settings.rules.isallempty = function(text,csv){ //if text of field isn't empty, valid if (text) return true; var array = csv.split(','); // you're separating string commas var isvalid = false; // return value $.each(array,function(index,elem){ // each item in array, input element specified name, , check if has values var element = $("input[name='"+elem+"']"); //if element found, , it's value not empty, valid if (element && element.val()) isvalid = true; }); return isvalid; }; var formvalidationrules = { ssn: { identifier: 'ssn', rules: [{ type: "isallempty[phone]", //if got additional fields compare, append inside [] "," separator //e.g. isallempty[field1, field2] prompt: 'an error occurred' }] } } $('.ui.form').form(formvalidationrules); });
Comments
Post a Comment