To show error messages healthy, each field must be wrapped by an element like <div>
<form id="exm" method="POST" action="#"> <div> <label>Required :</label> <input type="text" name="name" data-validetta="required"> </div> <div> <label>Email :</label> <input type="text" name="email" data-validetta="email"> </div> <button type="submit">Submit</button> <button type="reset">Reset</button> </form>
(function($){ $('#exm').validetta({ realTime: true, display : 'inline', errorTemplateClass : 'validetta-inline', onValid : function( event ) { event.preventDefault(); alert('Success'); } }); });