javascript Helpers paravalidaçãodeformulários

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript Helpers paravalidaçãodeformulários相关的知识,希望对你有一定的参考价值。

const {
	addClass,
	removeClass
} = require('./helpers');

// Método que converte uma string para minúsculo sem caracteres especiais
function regexStr(str, regexChain) {
	const regexData = [{
			pattern: "À",
			result: "A"
		},
		{
			pattern: "Á",
			result: "A"
		},
		{
			pattern: "Â",
			result: "A"
		},
		{
			pattern: "Ã",
			result: "A"
		},
		{
			pattern: "Ä",
			result: "A"
		},
		{
			pattern: "Å",
			result: "A"
		},
		{
			pattern: "Æ",
			result: "AE"
		},
		{
			pattern: "Ç",
			result: "C"
		},
		{
			pattern: "È",
			result: "E"
		},
		{
			pattern: "É",
			result: "E"
		},
		{
			pattern: "Ê",
			result: "E"
		},
		{
			pattern: "Ë",
			result: "E"
		},
		{
			pattern: "Ì",
			result: "I"
		},
		{
			pattern: "Í",
			result: "I"
		},
		{
			pattern: "Î",
			result: "I"
		},
		{
			pattern: "Ï",
			result: "I"
		},
		{
			pattern: "IJ",
			result: "IJ"
		},
		{
			pattern: "Ð",
			result: "D"
		},
		{
			pattern: "Ñ",
			result: "N"
		},
		{
			pattern: "Ò",
			result: "O"
		},
		{
			pattern: "Ó",
			result: "O"
		},
		{
			pattern: "Ô",
			result: "O"
		},
		{
			pattern: "Õ",
			result: "O"
		},
		{
			pattern: "Ö",
			result: "O"
		},
		{
			pattern: "Ø",
			result: "O"
		},
		{
			pattern: "Œ",
			result: "OE"
		},
		{
			pattern: "Þ",
			result: "TH"
		},
		{
			pattern: "Ù",
			result: "U"
		},
		{
			pattern: "Ú",
			result: "U"
		},
		{
			pattern: "Û",
			result: "U"
		},
		{
			pattern: "Ü",
			result: "U"
		},
		{
			pattern: "Ý",
			result: "Y"
		},
		{
			pattern: "Ÿ",
			result: "Y"
		},
		{
			pattern: "à",
			result: "a"
		},
		{
			pattern: "á",
			result: "a"
		},
		{
			pattern: "â",
			result: "a"
		},
		{
			pattern: "ã",
			result: "a"
		},
		{
			pattern: "ä",
			result: "a"
		},
		{
			pattern: "å",
			result: "a"
		},
		{
			pattern: "æ",
			result: "ae"
		},
		{
			pattern: "ç",
			result: "c"
		},
		{
			pattern: "è",
			result: "e"
		},
		{
			pattern: "é",
			result: "e"
		},
		{
			pattern: "ê",
			result: "e"
		},
		{
			pattern: "ë",
			result: "e"
		},
		{
			pattern: "ì",
			result: "i"
		},
		{
			pattern: "í",
			result: "i"
		},
		{
			pattern: "î",
			result: "i"
		},
		{
			pattern: "ï",
			result: "i"
		},
		{
			pattern: "ij",
			result: "ij"
		},
		{
			pattern: "ð",
			result: "d"
		},
		{
			pattern: "ñ",
			result: "n"
		},
		{
			pattern: "ò",
			result: "o"
		},
		{
			pattern: "ó",
			result: "o"
		},
		{
			pattern: "ô",
			result: "o"
		},
		{
			pattern: "õ",
			result: "o"
		},
		{
			pattern: "ö",
			result: "o"
		},
		{
			pattern: "ø",
			result: "o"
		},
		{
			pattern: "œ",
			result: "oe"
		},
		{
			pattern: "ß",
			result: "ss"
		},
		{
			pattern: "þ",
			result: "th"
		},
		{
			pattern: "ù",
			result: "u"
		},
		{
			pattern: "ú",
			result: "u"
		},
		{
			pattern: "û",
			result: "u"
		},
		{
			pattern: "ü",
			result: "u"
		},
		{
			pattern: "ý",
			result: "y"
		},
		{
			pattern: "ÿ",
			result: "y"
		},
		{
			pattern: "ff",
			result: "ff"
		},
		{
			pattern: "fi",
			result: "fi"
		},
		{
			pattern: "fl",
			result: "fl"
		},
		{
			pattern: "ffi",
			result: "ffi"
		},
		{
			pattern: "ffl",
			result: "ffl"
		},
		{
			pattern: "ſt",
			result: "ft"
		},
		{
			pattern: "st",
			result: "st"
		},
		{
			pattern: "´`·#¬\\/()=?¿¡!^[*\\]¨{}<>;,:.'\\-_\"’”“–—¹|»«",
			result: ""
		},
		{
			pattern: "aàáäâÀÁÄÂãÃ",
			result: "a"
		},
		{
			pattern: "eèéëêÈÉËÊ",
			result: "e"
		},
		{
			pattern: "iìíïîÌÍÏÎ",
			result: "i"
		},
		{
			pattern: "oòóöôÒÓÖÔõÕ",
			result: "o"
		},
		{
			pattern: "uùúüûÙÚÜÛ",
			result: "u"
		},
		{
			pattern: "çÇ",
			result: "ç"
		},
		{
			pattern: "2²",
			result: 2
		}
	];
	regexChain = regexChain != undefined ? regexChain : regexData
	if (regexChain) {
		let r = str.toLowerCase();
		for (let i = 0; i < regexChain.length; i++) {
			r = r.replace(new RegExp(`[${regexChain[i].pattern}]`, "g"), regexChain[i].result);
		}
		return r;
	} else {
		return str;
	}
};

// Método que valida se um texto possui html, aspas, muitos espaços ou é vazio ou não atinge o minlenght
// Ele também retorna os erros e coloca um uma div especifica habilitando e desabilitando o botao do formulário
function checkStringInput(string, target, sendButton, classDisable, classEnable) {
	// Regex caracteres HTML
	let html = /(<([^>]+)>)/gi;
	// Regex para aspas " e '
	let quotes = /['"]+/g;
	// Regex para espaços consecutivos
	let spaces = /\s\s+/g;

	if (string.match(html)) {
		target.innerHTML = "";
		removeClass(sendButton, classEnable);
		sendButton.classList.contains(classDisable) ? '' : addClass(sendButton, classDisable);
		let erro = "Não é permitido o envio de tags em HTML.";
		target.innerHTML = chooseMessageType(erro, "danger");

	} else if (string.match(quotes)) {
		target.innerHTML = "";
		removeClass(sendButton, classEnable);
		sendButton.classList.contains(classDisable) ? '' : addClass(sendButton, classDisable);
		let erro = "Não é permitido o envio de tags com aspas.";
		target.innerHTML = chooseMessageType(erro, "danger");

	} else if (string.match(spaces)) {
		target.innerHTML = "";
		removeClass(sendButton, classEnable);
		sendButton.classList.contains(classDisable) ? '' : addClass(sendButton, classDisable);
		let erro = "O texto digitado contém muitos espaços entre as palavras.";
		target.innerHTML = chooseMessageType(erro, "danger");

	} else if (string.length <= 0) {
		target.innerHTML = "";
		removeClass(sendButton, classEnable);
		sendButton.classList.contains(classDisable) ? '' : addClass(sendButton, classDisable);
		let erro = "Sua mensagem não pode estar vazia.";
		target.innerHTML = chooseMessageType(erro, "warning");

	} else if (string.length <= 4) {
		target.innerHTML = "";
		removeClass(sendButton, classEnable);
		sendButton.classList.contains(classDisable) ? '' : addClass(sendButton, classDisable);
		let erro = "Você precisa digitar um texto para enviar o formulário.";
		target.innerHTML = chooseMessageType(erro, "warning");

	} else {
		target.innerHTML = "";
		removeClass(sendButton, classDisable);
		addClass(sendButton, classEnable);
	}
}

// Método que retorna um template padrão de mensagens
// Type pode ser danger, warning, wait, loader, info e success
function chooseMessageType(erro, type) {
	return `<div class="alert alert-xs alert-${type}">
						<strong>Erro - </strong>${erro}
					</div>`;
}

module.exports = {
	regexStr,
	checkStringInput,
	chooseMessageType
};

以上是关于javascript Helpers paravalidaçãodeformulários的主要内容,如果未能解决你的问题,请参考以下文章

javascript ES6 Dom Helpers / Utilities Boilerplate(代替jQuery使用)

MVC Ajax Helpers

原生JavaScript实现对象的混合与克隆效果,带完整版解析代码[helpers.js]

原生JavaScript实现对象的混合与克隆效果,带完整版解析代码[helpers.js]

express 笔记 app.helpers 和 app.locals

Javascript中跨多个文件的全局变量