0

Tengo un input text , donde quisiera limitar los caracteres ingresados por el usuario a "solo números y comas" , o sea :

Ej1 : "1001,1002,1003" Ej2 : "1001" Ej3 : "1001,2002"

Como podría hacerlo en jquery ? copio fragmento del código :

			<div id="marco">
				<span id="nombre_campo">Ingrese el Nº de planilla : </span><input type="text" data-planilla="" id="cajita" name="ingreso" autofocus>
				<input type="button" id="boton1" name="enviar" data-planilla="NO"  onclick="Muestro_Valor()" value="Buscar">
			</div>

4
  • Si bien es redundante, aclaro que el input text es "cajita" . slds
    – look68
    el 13 dic. 2018 a las 18:26
  • 1
    Ahi saque mi respuesta agrega al titulo entre parentesis la version de jquery que tenes asi alguien que venga usandolo hace mucho puede ayudarte, yo lo empece a usar hace poco, sigo buscando
    – Juan
    el 13 dic. 2018 a las 19:37
  • Juan todo ok, gracias ! Use una version mas nueva de jquery la 1.9 , no me generó otros conflictos y tu rutina me funciono perfecto.
    – look68
    el 13 dic. 2018 a las 19:50
  • Bueno ahi puse la respuesta devuelta para que quede entonces
    – Juan
    el 13 dic. 2018 a las 19:51

1 respuesta 1

1

Con ese script solo dejas que en el input ponga numero y comas.

	$('.input-number').on('input', function () { 
this.value = this.value.replace(/[^0-9,]/g,'');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="input-number" value="" />

Respondiendo a tu consulta en el comentario te dejo un ejemplo de como se me ocurrio hacerlo es probable que haya 10.000 formas mejores pero solo me salio esa. Probe haciendolo solo con addClass y removeClass pero no funciona debe ser por la inicializacion del input asi que directamente lo remuevo del dom y lo vuelvo a generar con otra clase. Repito, tomalo como una "guia" de cual puede llegar a ser la idea, recien lo hice, ya lo miro y te digo por seguro que debe haber una forma muchisimo mejor.

 $('#select').on('change', function() {

 	if(this.value == 0){
 		$("#cajita").remove()
 		$("#contenedor").html("<input type='text' data-planilla=' id='cajita' name='ingreso' autofocus class='conRestriccion' placeholder='Aplica restriccion'>")
 	}
 	else{
 		$("#cajita").remove()
 		$("#contenedor").html("<input type='text' data-planilla=' id='cajita' name='ingreso' autofocus class='sinRestriccion' placeholder='Aplica sin restriccion'>")
 	}

$('.conRestriccion').on('input', function () { 
	this.value = this.value.replace(/[^0-9,]/g,'');
});

});
<script
  src="https://code.jquery.com/jquery-1.9.0.js"
  integrity="sha256-TXsBwvYEO87oOjPQ9ifcb7wn3IrrW91dhj6EMEtRLvM="
  crossorigin="anonymous"></script>

<select name="" id="select">
<option value="vacio">Seleccionar una opcion</option>
<option value="0">Con restriccion</option>
<option value="1">Sin restriccion</option>
</select>

<br><br>
<div id="marco">
<span id="nombre_campo">Ingrese el Nº de planilla : </span>
<div id="contenedor">
	<input type="text" data-planilla="" id="cajita" name="ingreso" autofocus class="sinRestriccion" placeholder="Inicia sin restricción">
</div><br>
<input type="button" id="boton1" name="enviar" data-planilla="NO"  onclick="Muestro_Valor()" value="Buscar">
</div>

6
  • Estoy usando : <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
    – look68
    el 13 dic. 2018 a las 19:07
  • y he adaptado a mi codigo asi : $('#cajita').on('input', function () { this.value = this.value.replace(/[^0-9,]/g,''); });
    – look68
    el 13 dic. 2018 a las 19:07
  • Por que motivo no funciona y me traba todo ? comento la funcion y vuelve a funcionar ..
    – look68
    el 13 dic. 2018 a las 19:08
  • Acabo de ver version por version de Jquery, el codigo que te pase funciona a partir de la 1.7.0 y actualmente va por la 3.3.1, voy a investigar pero no se como se hara en una version tan antigua
    – Juan
    el 13 dic. 2018 a las 19:24
  • Juan , algo que no se como hacer y se me pasó. Yo aplique al input : $('#cajita').on('input', function () { this.value = this.value.replace(/[^0-9,]/g,'');}); , pero segun lo que elijo utilizo el mismo input para ingreso sin restricciones, como limpio el replace ?
    – look68
    el 13 dic. 2018 a las 20:28

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.