Para este caso se me pidió validar las cajas de texto <asp:textbox> para que solo se escriban números del 1 al 4 y que un número ya escrito en un tetbox no se repita en otro. Asi:
En realidad no es nada difícil pero lo dejo por si alguna vez alguien lo necesita. Dibujamos en pantalla 4 textbox, yo los llamé de la siguiente forma: txt_prg17_1, txt_prg17_2, txt_prg17_3, txt_prg17_4
Ahora vamos a hacer uso de una función javascript:
<script language="javascript">
//función trim para quitar los espacios en blanco
function trim (myString)
{
return myString.replace(/^\s+/g,'').replace(/\s+$/g,'')
}
function soloNumeros(evt,orden) //evt es el valor digitado, y orden indica a que textbox vamos a validar, si se escribe 1 es el 1er textbox
{
//Validar la existencia del objeto event
evt = (evt) ? evt : event;
////Extraer el codigo del caracter de uno de los diferentes grupos de codigos
var charCode = (evt.charCode) ? evt.charCode : ((evt.keyCode) ? evt.keyCode : ((evt.which) ? evt.which : 0));
//Predefinir como valido
var respuesta = true;
//Validar si el codigo corresponde a los NO aceptables
//valido solo los números del 1 al 4 y el backspace
if (charCode > 31 && (charCode < 49 || charCode > 52))
{
//Asignar FALSE a la respuesta si es de los NO aceptables
respuesta = false;
}
//
if (orden==1) // para el 1er textbox
{
// obtengo los valores de los textbox 2,3,4
var b = document.getElementById("<%=txt_prg17_2.ClientID %>").value;
var c = document.getElementById("<%=txt_prg17_3.ClientID %>").value;
var d = document.getElementById("<%=txt_prg17_4.ClientID %>").value;
if (trim(b)!="") // validar que tenga valor
{
var b_asc=b.charCodeAt(0); // convirto el valor del textbox2 en ascii
if(charCode==b_asc) // comparo ascii si son iguales signnifica q estoy ingresando un valor duplicado asi que se retorna falso
return false;
}
if (trim(c)!="")
{
var c_asc=c.charCodeAt(0);
if(charCode==c_asc)
return false;
}
if (trim(d)!="")
{
var d_asc=d.charCodeAt(0);
if(charCode==d_asc)
return false;
}
}
if (orden==2) // para el 2do textbox
{
var a = document.getElementById("<%=txt_prg17_1.ClientID %>").value;
var c = document.getElementById("<%=txt_prg17_3.ClientID %>").value;
var d = document.getElementById("<%=txt_prg17_4.ClientID %>").value;
if (trim(a)!="")
{
var a_asc=a.charCodeAt(0);
if(charCode==a_asc)
return false;
}
if (trim(c)!="")
{
var c_asc=c.charCodeAt(0);
if(charCode==c_asc)
return false;
}
if (trim(d)!="")
{
var d_asc=d.charCodeAt(0);
if(charCode==d_asc)
return false;
}
}
if (orden==3) // para el 3er textbox
{
var a = document.getElementById("<%=txt_prg17_1.ClientID %>").value;
var b = document.getElementById("<%=txt_prg17_2.ClientID %>").value;
var d = document.getElementById("<%=txt_prg17_4.ClientID %>").value;
if (trim(a)!="")
{
var a_asc=a.charCodeAt(0);
if(charCode==a_asc)
return false;
}
if (trim(b)!="")
{
var b_asc=b.charCodeAt(0);
if(charCode==b_asc)
return false;
}
if (trim(d)!="")
{
var d_asc=d.charCodeAt(0);
if(charCode==d_asc)
return false;
}
}
if (orden==4) // para el 4to textbox
{
var a = document.getElementById("<%=txt_prg17_1.ClientID %>").value;
var b = document.getElementById("<%=txt_prg17_2.ClientID %>").value;
var c = document.getElementById("<%=txt_prg17_3.ClientID %>").value;
if (trim(a)!="")
{
var a_asc=a.charCodeAt(0);
if(charCode==a_asc)
return false;
}
if (trim(b)!="")
{
var b_asc=b.charCodeAt(0);
if(charCode==b_asc)
return false;
}
if (trim(c)!="")
{
var c_asc=c.charCodeAt(0);
if(charCode==c_asc)
return false;
}
}
return respuesta; // si las validaciones se pasaron con éxito, se escribe el valor digitado en la caja de texto
}
</script>
Ahora en la vista html de nuestra página referenciamos a nuestra función javascript en el evento OnKeyPress de cada textbox
<asp:TextBox ID="txt_prg17_1" runat="server" MaxLength="1" Width="30px" onKeyPress="javascript:return soloNumeros(event,1)"></asp:TextBox>
<asp:TextBox ID="txt_prg17_2" runat="server" MaxLength="1" Width="30px" onKeyPress="javascript:return soloNumeros(event,2)"></asp:TextBox>
<asp:TextBox ID="txt_prg17_3" runat="server" MaxLength="1" Width="30px" onKeyPress="javascript:return soloNumeros(event,3)"></asp:TextBox>
<asp:TextBox ID="txt_prg17_4" runat="server" MaxLength="1" Width="30px" onKeyPress="javascript:return soloNumeros(event,4)"></asp:TextBox>
Con esto los textbox quedan validados. Este código de seguro se puede optimizar, reducir líneas de código, así que eso tambipen me queda como tarea pendiente jeje. Saludos
No hay comentarios:
Publicar un comentario