javascript - Form is not getting validate -
i have created 1 form add record in database, insertion of record , working well.
i wanted put validation form, happening though have set fields required after clicking on submit button form getting submit , blank values getting insert n database.
i have referred link validation :
a simple jquery form validation script
but somehow not working me.
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>post</title> </head> <body> <form class="postform" id="postform" method="post" action="addpost.php"> <fieldset> <legend>please add details below </legend> <p> <label for="title">title (required, @ least 2 characters)</label> <input id="title" name="title" minlength="2" type="text" required> </p> <p> <label for="url">url (required)</label> <input id="url" type="url" name="url" required> </p> <p> <label for="desc">description (required, @ least 2 characters)</label> <input id="desc" name="desc" minlength="2" type="text" required> </p> <p> <label for="keywords">keywords (eg:#facebook)(required, @ least 2 characters)</label> <input id="keywords" name="keywords" minlength="2" type="text" required> </p> <p> <label for="urltype">select url type :(required)</label> <select name="urltype" id="urltype"> <option value="">select url type...</option> <option value="0">server image</option> <option value="1">server video</option> <option value="2">youtube video</option> <option value="3">vimeo video</option> <option value="4">facebook image</option> <option value="5">facebook video</option> <option value="6">instagram image</option> <option value="7">instagram video</option> <option value="-1">other</option> </select> </p> <p> <label for="posttype"> select post type :(required)</label> <select name="posttype" id="posttype"> <option value="">select post type...</option> <option value="0">normal</option> <option value="1">featured</option> <option value="2">sponsored</option> </select> </p> <p> <label for="category"> select category :(required)</label> <select name="category" id="category"> <option value="0">select category...</option> </select> </p> <p> <input type="hidden" name="action_type" id="action_type_id"/> <input type="hidden" name="id" id="p_id"/> <!-- <a href="javascript:void(0);" class="btn btn-warning" onclick="$('#postform').slideup();">cancel</a> <a href="javascript:void(0);" class="btn btn-success" onclick="useraction('add')">add user</a>--> <input type="button" name="submit" id="submit" value="submit" onclick="useraction('add')"> </p> </fieldset> <div class="result" id="result"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(document).ready(function(){ getcategories(); }); function getcategories() { $.ajax({ type: "post", url: 'getcategories.php', datatype: 'text', async: false, cache: false, success: function (result) { $('#category').html(result); } }); } function useraction(type,id){ var statusarr = {add:"added",edit:"updated",delete:"deleted"}; if (type == 'add') { $('#action_type_id').val(type); $('#p_id').val(id); } $.ajax({ type: 'post', url: 'addpost.php', data: $('#postform').serialize(), success:function(report){ // replace data report $(".result").html(report); $("#postform").trigger('reset'); } }); } </script> </form> <script> $("#postform").validate(); </script> </body> </html> please help, thank you..
need reference jquery validate
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script> then need initialize plugin, demo example -
$('#postform').validate({ submithandler: function (form) { // demo useraction('add'); } }); remove onclick firing onsubmit , need call useraction submithandler
Comments
Post a Comment