I would like to validate the email addresses with input html kendo. This is my html code:
<label for="doc" class="required">E-mail</label>
<input type="email" multiple pattern="^([\w+-.%]+@[\w-.]+\.[A-Za-z]{2,4},*[\W]*)+$" value="" data-bind="value: mail" id="doc" name="mail" required data-email-msg="Email format is not valid" />
I would like the addresses to be separated by a comma, but this doesn't work!is not validate for kendo
Here is working DEMO to validate multiple emails in a single input field separated by semicolon.
For this I have created a custom Kendo validator rule. The code snippet from the DEMO is show below:
HTML:
<input type="text" class="k-textbox" name="Email" id="Email" required data-required-msg="Please enter atleast one email" data-multipleemails-msg="Some of the Entered Email ids are invalid"/>
JS:
function validateEmail(email) {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
}
$(function () {
var container = $("#employeeForm");
kendo.init(container);
container.kendoValidator({
rules: {
multipleemails: function (input) {
if (input.is("[data-multipleemails-msg]") && input.val() != "")
{
var emailsArray = input.val().split(";");
for (var i=0; i < emailsArray.length; i++)
{
//alert(emailsArray[i]);
//return validateEmail(emailsArray[i].trim());
if ((emailsArray[i].trim() != "") && (validateEmail(emailsArray[i].trim()) == false))
{
return false;
}
}
}
return true;
}
}
});
});
$('#save').click(function() {
//alert('save');
var validator = $("#employeeForm").data("kendoValidator");
if (validator.validate()) {
alert("Form is successfully validated");
}
});