Need to type only email id instead of text in jquery token input

Question

I want, only the email should be accepted in the token input, not an ordinary text..

Answer 1

You can use jquery validation for checking email or not.

Eg:

function IsEmail(email) {
 var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
return regex.test(email);
}

pass email value to email parameter to IsEmail function.

Answer 2

To add to Vinod's answer, and relate it to the jquery-tokeninput plugin you specified, I don't believe there is a method specifically built to validate free-text input prior to it being added.

I'd recommend making use of the onAdd callback, running the item (passed as parameter) through Vinod's isEmail function there, and then removing the new item if it fails the regex test.

Untested Example Code: (You may need to alter the remove method, I'm not sure if it takes an actual object, or a JSON string.)

$("#my-text-input").tokenInput("/url/to/your/script/",{
   onAdd: function(item){
       if(!isEmail(item.value)) $("#my-text-input").tokenInput("remove", item);
   }
});

Answer 3

I have tried out this and it works fine for me..

For your kind reference..

resultsFormatter: function(item){    
var email_regex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i;
console.log("item.email"+item.email);
if(item.email != null){
console.log("Email lalal:: "+item.email);
return "<li>" + item.name +" &lt;"+item.email+"&gt;"+"</li>";   
}
if(item.name.match(email_regex)){
return "<li>" +" Private Student "+ item.name+ "</li>";
}else{
return "<li style='display:none;'>" +" "+"</li>";   
}                   
}
}