programmatically mail tag #12
Description
i want to add programmatically insert mail but not work,what is wrong?
(function( $ ){
var $orig,$list,deleteIconHTML,$input,$container;
$.fn.multiple_emails = function(options) {
// Default options
var settings = jQuery.extend({
checkDupEmail: true,
theme: "Bootstrap",
position: "top"
},options);
// Merge send options with defaults
$(this).data('settings', settings);
if (settings.theme.toLowerCase() == "Bootstrap".toLowerCase())
{
deleteIconHTML = '<a href="#" class="multiple_emails-close" title="Remove"><span class="glyphicon glyphicon-remove"></span></a>';
}
else if (settings.theme.toLowerCase() == "SemanticUI".toLowerCase() || settings.theme.toLowerCase() == "Semantic-UI".toLowerCase() || settings.theme.toLowerCase() == "Semantic UI".toLowerCase()) {
deleteIconHTML = '<a href="#" class="multiple_emails-close" title="Remove"><i class="remove icon"></i></a>';
}
else if (settings.theme.toLowerCase() == "Basic".toLowerCase()) {
//Default which you should use if you don't use Bootstrap, SemanticUI, or other CSS frameworks
deleteIconHTML = '<a href="#" class="multiple_emails-close" title="Remove"><i class="basicdeleteicon">Remove</i></a>';
}
return this.each(function() {
//$orig refers to the input HTML node
$orig = $(this);
$list = $('<ul class="list-inline" />'); // create html elements - list of email addresses as unordered list
if ($(this).val() != '' && $(this).IsJsonString($(this).val())) {
$.each(jQuery.parseJSON($(this).val()), function( index, val ) {
$list.append($('<li class="multiple_emails-email"><span class="email_name" data-email="' + val.toLowerCase() + '">' + val + '</span></li>')
.prepend($(deleteIconHTML)
.click(function(e) { $(this).parent().remove(); $(this).refresh_emails(); e.preventDefault(); })
)
);
});
}
$input = $('<input type="text" class="multiple_emails-input text-left" />').on('keyup', function(e) { // input
$(this).removeClass('multiple_emails-error');
var input_length = $(this).val().length;
var keynum;
if(window.event){ // IE
keynum = e.keyCode;
}
else if(e.which){ // Netscape/Firefox/Opera
keynum = e.which;
}
//if(event.which == 8 && input_length == 0) { $list.find('li').last().remove(); } //Removes last item on backspace with no input
// Supported key press is tab, enter, space or comma, there is no support for semi-colon since the keyCode differs in various browsers
if(keynum == 9 || keynum == 32 || keynum == 188) {
$(this).display_email($(this), settings.checkDupEmail);
}
else if (keynum == 13) {
$(this).display_email($(this), settings.checkDupEmail);
//Prevents enter key default
//This is to prevent the form from submitting with the submit button
//when you press enter in the email textbox
e.preventDefault();
}
}).on('blur', function(event){
if ($(this).val() != '') { $(this).display_email($(this), settings.checkDupEmail);}
});
$container = $('<div class="multiple_emails-container" />').click(function() { $input.focus(); } ); // container div
// insert elements into DOM
if (settings.position.toLowerCase() === "top")
$container.append($list).append($input).insertAfter($(this));
else
$container.append($input).append($list).insertBefore($(this));
return $(this).hide();
});
};
$.fn.addtag = function(tagstring) {
var settings = $(this).data('settings');
var emails = new Array();
var contain = $orig.siblings('.multiple_emails-container');
contain.find('.multiple_emails-email span.email_name').each(function() { emails.push($(this).html()); });
emails.push(tagstring);
$(this).val(tagstring);
$(this).display_email($(this), settings.checkDupEmail);
$orig.val(JSON.stringify(emails)).trigger('change');
};
$.fn.display_email = function(t, dupEmailCheck) {
var settings = $(this).data('settings');
//Remove space, comma and semi-colon from beginning and end of string
//Does not remove inside the string as the email will need to be tokenized using space, comma and semi-colon
//var arr = t.val().trim().replace(/^,|,$/g , '').replace(/^;|;$/g , '');
var arr = t.val();
//Remove the double quote
arr = arr.replace(/"/g,"");
//Split the string into an array, with the space, comma, and semi-colon as the separator
arr = arr.split(/[\,;]+/);
var errorEmails = new Array(); //New array to contain the errors
REGEX_EMAIL = '([a-z0-9!#$%&\'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&\'*+/=?^_`{|}~-]+)*@' + '(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?)';
var pattern = new RegExp('^' + REGEX_EMAIL + '$', 'i');
var pattern2 = new RegExp('^([^<]*)\<' + REGEX_EMAIL + '\>$', 'i');
for (var i = 0; i < arr.length; i++) {
//Check if the email is already added, only if dupEmailCheck is set to true
if ( dupEmailCheck === true && $orig.val().indexOf(arr[i]) != -1 ) {
if (arr[i] && arr[i].length > 0) {
new function () {
var existingElement = $list.find('.email_name[data-email=' + arr[i].toLowerCase().replace('.', '\\.').replace('@', '\\@') + ']');
existingElement.css('font-weight', 'bold');
setTimeout(function() { existingElement.css('font-weight', ''); }, 1500);
}(); // Use a IIFE function to create a new scope so existingElement won't be overriden
}
}
else if (pattern.test(arr[i]) == true) {
var match = arr[i].match(new RegExp(pattern));
$list.append($('<li class="multiple_emails-email" title="'+ match[0].toLowerCase() + '"><span class="email_name" data-email="' + match[0].toLowerCase() + '">' + match[0] + '</span></li>')
.prepend($(deleteIconHTML)
.click(function(e) { $(this).parent().remove(); $(this).refresh_emails(); e.preventDefault(); })
)
);
}
else if (pattern2.test(arr[i]) == true) {
var match = arr[i].match(new RegExp(pattern2));
$list.append($('<li class="multiple_emails-email" title="<'+ match[2].toLowerCase() + '>' + match[1]+'"><span class="email_name" data-email="' + match[2].toLowerCase() + '">' + match[1] + '</span></li>')
.prepend($(deleteIconHTML)
.click(function(e) { $(this).parent().remove(); $(this).refresh_emails(); e.preventDefault(); })
)
);
}
else
errorEmails.push(arr[i]);
}
// If erroneous emails found, or if duplicate email found
if(errorEmails.length > 0)
t.val(errorEmails.join("; ")).addClass('multiple_emails-error');
else
t.val("");
$(this).refresh_emails ();
};
$.fn.refresh_emails = function() {
var emails = new Array();
var container = $orig.siblings('.multiple_emails-container');
container.find('.multiple_emails-email span.email_name').each(function() { emails.push($(this).html()); });
$orig.val(JSON.stringify(emails)).trigger('change');
};
$.fn.IsJsonString = function(str) {
try { JSON.parse(str); }
catch (e) { return false; }
return true;
};
})(jQuery);