Tengo un campo de área de texto en un formulario donde puedo copiar y pegar (o escribir) números de teléfono móvil. Tendrá un número por línea, así puedo copiar y pegar (o escribir) miles de números móviles para enviar en ese formulario.
Quiero recortar ese campo, solo quiero que permanezcan números de 10 dígitos en ese campo después de copiar y pegar (o escribir).
Solo deben permanecer números válidos de 10 dígitos y todos los demás números no válidos deben eliminarse automáticamente de ese campo.
Ejemplo:
Si pego estos números en este campo de área de texto,
9848012345
9949123450
9949 123456
99491234
99491234561
+1236547890
9848098765
De esto, solo deben quedar números de 10 dígitos en el campo, así:
9848012345
9949123450
9848098765
<div class="form-group row"> <label for="title" class="col-lg-2 col-form-label">Mobile Numbers </label> <div class="col-lg-10"> <textarea onKeyUp="countline()" type="text" class="form-control required" required cols="10" rows="7" id="mobileno" name="mobileno"> </textarea> </div> </div> <div class="form-group row"> <label class="col-lg-2 control-label " for="userName">Number Count </label> <div class="col-lg-10"> <input type="text" class="form-control " readonly id="numbercount" required name="numbercount" value=""> </div> </div>Usando este script (onKeyUp="countline()") para contar números (líneas). Necesidad de mantener esto también.
<script> function countline() { var length = $('#mobileno').val().split("\n").length; document.getElementById("numbercount").value = length; } </script>Cualquier ayuda por favor. Gracias por adelantado.
Esto produce la salida deseada, sin embargo, no cuenta los dígitos, solo los caracteres.
const textArea = document.getElementById("mobileno"), validateEl = document.getElementById("validate"); validateEl.addEventListener("click", validate); function validate(e) { const filtered = textArea.value .split("\n") .filter(number => number.length === 10) .join("\n"); textArea.value = filtered; } <div class="form-group row"> <label for="title" class="col-lg-2 col-form-label">Mobile Numbers </label> <div class="col-lg-10"> <textarea type="text" class="form-control required" required cols="10" rows="7" id="mobileno" name="mobileno"></textarea> <button id="validate">Validate</button> </div> </div>