htmlAddUser = '\ \ \
L\'utilisateur existe déja !
\
le login comporte entre 8 et 16 caractères parmi a..z
\ \ \ \ \ \
le mot de passe comporte entre 8 et 16 caractères parmi a..z A..Z 0..9
\ \ \ \ '; passwordPatern = /^[a-zA-Z0-9]{8,16}$/; loginPatern = /^[a-z]{8,16}$/ mailPatern = /^(([^<>()\[\]\\.,;:\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,}))$/; //https://emailregex.com/ datePatern = /^\d{4}[\/\-](?:\d{1}|1[012]|0\d)[\/\-](?:\d{1}|[123]\d|0\d)/ $(function() { /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~INPUT EVENT~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ $("body").on("keyup change", ".pw input", function() { if (passwordPatern.test($(this).val()) || $(this).val() == "") { $(this).css("background-color", ""); $('div', $(this).parent()).css("display", "none"); } else { $(this).css("background-color", "red"); $('div', $(this).parent()).css("display", "block"); } }); $("body").on("keyup change", ".pw2 input", function() { if ($(this).val() == $(".pw input").val()) { $(this).css("background-color", ""); } else { $(this).css("background-color", "red"); } }); $("body").on("keyup change", ".email input", function() { if (mailPatern.test($(this).val())) { $(this).css("background-color", ""); $('div', $(this).parent()).css("display", "none"); } else { $(this).css("background-color", "red"); $('div', $(this).parent()).css("display", "block"); } }); $("body").on("keyup change", ".datene :input", function(e) { console.log(e.target.value); if (datePatern.test($(this).val())) { $(this).css("background-color", ""); $('div', $(this).parent()).css("display", "none"); } else { $(this).css("background-color", "red"); $('div', $(this).parent()).css("display", "block"); } }); $("body").on("keyup change", ".login input, input .login", function(e) { login = ltrim($(this).val()); input = $(this); td = $(this).parent(); if (loginPatern.test(login)) { $(this).css("background-color", ""); $('.ruleExcept', $(this).parent()).css("display", "none"); $.post("post.php", {userExist: login}, function(data) { try { if (data.return == "userExist") { $('.userExist', td).css("display", "block"); input.css("background-color", "red"); } else if(data.return == "userNotExist") { $('.userExist', td).css("display", "none"); input.css("background-color", ""); } } catch (e) { swal("Oops", "Something went wrong!
" + e, "error"); } }, "json"); } else { $(this).css("background-color", "red"); $('.ruleExcept', td).css("display", "block"); } }); /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~TR TO DEL~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ $("#allRecord").on("click", ".delUser", function() { newUser = false; tr = $(this).parent().parent(); var login = ""; var sl = ""; if (tr.find("i.editUser").length !== 0) { sl = ltrim($('.sl', tr).html()) login = $('.login', tr).html(); } else if (tr.find("i.confirmEditUser").length !== 0) { sl = $('.sl select', tr).val(); login = $('.login', tr).html(); } else { try { login = "New user " + $('.login input', tr).val(); newUser = true; } catch (e) { swal("error : " + e); return; } } if (sl == "10") { swal("Oops", "You can't del user with sl 10", "error"); return; } login = ltrim(login); swal({ title: "Are you sure to del " + login + " ?", text: "Once deleted, you will not be able to recover this!", icon: "warning", buttons: true, dangerMode: true, }) .then((willDelete) => { if (willDelete) { if (!newUser) $.post("post.php", { userToDel: login }, function() { tr.remove(); swal("Poof! " + login + " has been deleted!", { icon: "success", }); }); else { tr.remove(); swal("Poof! " + login + " has been deleted!", { icon: "success", }); } } else { } }); }); /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~TR TO EDIT~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ $("#allRecord").on("click", ".editUser", function() { $(this).toggleClass('fa-edit fa-check'); $(this).toggleClass('editUser confirmEditUser'); for (i = 1; i < $("td", $(this).parent().parent()).length - 1; i++) { j = $($("td", $(this).parent().parent())[i]); className = j.attr('class'); if (className == "sl") { val = ltrim(j.html()); opt = ($("#slVal").val()=="10"?"":"disabled") j.html('') } else { inputOptions = ''; if (className == "pw") inputOptions += 'type="password" data-oldpw="' + ltrim(j.html()) + '" '; else if (j.attr('class') == "datene") inputOptions += 'type="date" placeholder="yyyy/mm/dd"' j.html(''); if (className == "pw") { j.append("
le mot de passe comporte entre 8 et 16 caractères parmi a..z A..Z 0..9
") } } } }); /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~CONFIRM EDIT/NewUser~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ $("#allRecord").on("click", ".confirmEditUser, .confirmNewUser", function() { /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~CALL BACK DE LA VERIF DE MOT DE PASSE~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ function callBackVerifPW(data) { function postData(dataToSend) { $.post("post.php", dataToSend, function(data) { try { if (data.return == true) { for (i = (dataToSend["newUser"]?0:1); i < tds.length - 1; i++) //On change les input en pure html { j = $(tds[i]); className = j.attr('class'); if (className == "pw") value = data.pw; else value = $('input,select', j).val(); j.html(value); } swal("all done"); $(that).toggleClass('fa-check fa-edit'); $(that).toggleClass('confirmEditUser editUser'); } else swal("Oops", "Something went wrong!
" + JSON.stringify(data), "error"); } catch (e) { swal("Oops", "Something went wrong!
" + e, "error"); } }, "json"); } var dataToSend = new Object(); //Objet contenant les données à envoyé dataToSend["newUser"] = tr.is(".newRecord") dataToSend["updatePW"] = (data === true ? false : true); //Si maj du mdp data === false if ($(".pw input", tr).val() === data || data === true && !dataToSend["newUser"]) //Verif du mot de passe si nécesaire { for (i = 0; i < tds.length - 1; i++) //Analyse de chaque td { j = $(tds[i]); className = j.attr('class'); if (className == "pw" && data === true) value = $('input,select', j).data("oldpw"); else if (className == "login" && !dataToSend["newUser"]) value = ltrim(j.html()); else value = $('input,select', j).val(); dataToSend[className] = value; } if(dataToSend["newUser"]) $.post("post.php", {userExist: dataToSend["login"]}, function(data) { try { if (data.return == "userExist") { $('.userExist', tr).css("display", "block"); $(".login input", tr).css("background-color", "red"); swal("Oops", "User "+dataToSend["login"]+" already exist !", "error"); return false; } else if(data.return == "userNotExist") { $('.userExist', tr).css("display", "none"); $(".login input", tr).css("background-color", ""); postData(dataToSend); } } catch (e) { swal("Oops", "Something went wrong!
" + e, "error"); } }, "json"); else postData(dataToSend); } else { swal("Oops", (dataToSend["newUser"]?"New user need password !":"Password don't match !"), "error"); } } /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ tds = $("td", $(this).parent().parent()); //Récupère les td concernant le click tr = $(this).parent().parent(); //Récupère le tr concernant le click that = this; if (mailPatern.test($(".email input", tr).val()) && (passwordPatern.test($(".pw input", tr).val()) || $(".pw input", tr).val() == "")) if ($(".pw input", tr).val() === "") { callBackVerifPW(true); } else { swal({ closeOnClickOutside: false, closeOnEsc: false, content: { element: "input", attributes: { placeholder: "Confirmer le mot de passe", type: "password", }, }, }).then(callBackVerifPW); } else swal("Oops", "Input don't respect rules !", "error"); }); /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~ADD USER~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ $("#allRecord").on("click", ".fa-user-plus", function() { $(this).parent().parent().before(htmlAddUser); }); $("#allRecord").on("click", ".confirmNewUser", function() { }); $("#allRecord").on("click", ".delNewUser", function() { tr = $(this).parent().parent(); tr.remove(); }); }); //J'avais plein d'espace à droite et à gauche en récupérent mon innerHTML //https://stackoverflow.com/questions/24282158/removing-the-white-space-at-the-start-of-the-string function ltrim(str) { if (str == null) return str; str = str.replace(/^\s+/g, '') str = str.replace(/\s+$/g, '') return str; }