I have a modal that presents a number and I do this with the help of java script. In my page I have a search, and in the results I noticed that only the first result appears with the field with the correct formatting like this: (00) 0000-0000.
How can I do so that in the results javascript can understand each script as individual?
Follow my code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.1.62/jquery.inputmask.bundle.js"></script>
<!--Campo NUMERO-->
<label for="numero" class="control-label" >
<br>NÚMERO:<br></label>
<div class="input-group col-lg-5">
<div class="input-group-addon">
<span class="glyphicon glyphicon-earphone" id="basic-addon-numero"></span>
</div>
<input type='text' id='numero' name='numero' value="<?php echo $numero ?>" class="form-control" maxlength='15' required autofocus placeholder="(00) 0000-0000"><br>
<script>
$(window).load(function()
{
var phones = [{ "mask": "(##) ####-####"}];
$('#numero').inputmask({
mask: phones,
greedy: false,
definitions: { '#': { validator: "[0-9]", cardinality: 1}} });
});
</script>
</div>
<!--Fim Campo NUMERO-->I have an example that I use, however, as I do not know much about JavaScript, I do not know how to fit the case I asked. Here is the example I use in fashion and it works.
<script>
function mostrar1(e) {
var tipo = e.parentNode.querySelector("[name='senha1']");
if (tipo.type == "password") {
tipo.type = "text";
} else {
tipo.type = "password";
}
tipo.type = tipo.type; //aplica o tipo que ficou no primeiro campo
if (e.classList.contains("glyphicon-eye-open")) { //se tem olho aberto
e.classList.remove("glyphicon-eye-open"); //remove classe olho aberto
e.classList.add("glyphicon-eye-close"); //coloca classe olho fechado
} else { //senão
e.classList.remove("glyphicon-eye-close"); //remove classe olho fechado
e.classList.add("glyphicon-eye-open"); //coloca classe olho aberto
}
}
</script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!--Campo Senha-->
<form method="POST">
<div class='input-group col-lg-6'>
<div class='input-group-addon'>
<span class='glyphicon glyphicon-question-sign'></span>
</div>
<input type='password' name='senha1' id="senha1" class='form-control' placeholder='Nova Senha' autofocus required></div>
<button type="button" class="btn btn-sm glyphicon glyphicon-eye-open "
onclick="mostrar1(this)"></button>
</form>
<!-- Script para ambos os botões -->