How can I use x-editable and jquery validation plugin

Question

How can i validate information using jquery validation plugin when using XEDITABLE for edit-in-place?

This is my current non-validated x-editable field

This is what i pretend

Answer 1

I use valib.js instead of stone jquery validation

HTML:

<p>X-editable Bootstrap popup</p>
<div style="margin: 150px">
    <a href="#" id="email">awesome</a>
</div>

JS:

$('#email').editable({
    type: 'text',
    url: '/post',    
    pk: 1,    
    placement: 'top',
    title: 'Enter email' ,
    validate:function(value){

       var v=valib.String.isEmailLike(value)         
       if(v==false) return 'Please insert valid mail';
    }   
});

DEMO