UNIDAD 2: INSTRUCCIONES DE CONTROL DE PROGRAMA

TEMA JSCRIPT 11: COMPONENTE RadioButton y RadioButtonList

Se utiliza para presentar al usuario un conjunto de opciones mutuamente excluyentes entre si es decir, si el usuario selecciona un componente radio todos los demas componentes radioButton en la forma se desmarcan o deseleccionan solos, es por esta razon que decimos que radiobotones son mutuamente excluyentes.

RADIOBUTTON:

Codigo prog10.aspx

<HTML>
<FORM RUNAT=SERVER>
SEXO:<BR>
<ASP:RADIOBUTTON TEXT=MASCULINO ID=MASCULINO GROUPNAME=GRUPO1 RUNAT=SERVER />
<ASP:RADIOBUTTON TEXT=FEMENINO ID=FEMENINO GROUPNAME=GRUPO1 RUNAT=SERVER /><BR>
<ASP:RADIOBUTTON TEXT=0-10 ID=DIEZ GROUPNAME=GRUPO2 RUNAT=SERVER />
<ASP:RADIOBUTTON TEXT=10-20 ID=VEINTE GROUPNAME=GRUPO2 RUNAT=SERVER /><BR>
<ASP:BUTTON ONCLICK=SELECCIONAR TEXT=OK RUNAT=SERVER /><BR>
<ASP:LABEL ID=SEXO RUNAT=SERVER /><BR>
<ASP:LABEL ID=EDAD RUNAT=SERVER /><BR>
</FORM></HTML>
<SCRIPT LANGUAGE=JSCRIPT RUNAT=SERVER>
function SELECCIONAR (sender: Object, e: EventArgs):void
{
if(MASCULINO.Checked) SEXO.Text = "MASCULINO";
if(FEMENINO.Checked) SEXO.Text = "FEMENINO";
if(DIEZ.Checked) EDAD.Text = "DE CERO A DIEZ";
if(VEINTE.Checked) EDAD.Text = "DE DIEZ A VEINTE";
}
</script>
</html>

1.- Observar que tenemos dos grupos de radiobotones uno con GRUPNAME=GRUPO1 y otro con GROUPNAME=GRUPO2 sin embargo cada radiobuton tiene su propio valor o ID.

2.- La razon principal para esta situacion es que los radiobotones son mutuamente excluyentes entre si Y QUE SOLO UNO PUEDE ESTAR ENCENDIDO A LA VEZ por eso los agrupamos con la propiedad GROUPNAME para que html los pueda considerar como dos o mas grupos diferentes.

3.- Tambien pueden usar la propiedad checked=true para que aparezcan seleccionados al cargar el programa prog11.aspx

4.- Para programarlo usar la misma tecnica que se analizo con CHECKBOX es decir revisar la propiedad checked y un monton de if's ( un if por cada radiobutton).

Corrida prog10.aspx

image411.jpg

Como se observa checkbox son cajitas con una palomita y radiobutton son circulitos con un puntito negro.

Pero su diferencia mas importante es que radiobtuton no permite que esten seleccionados dos o mas de ellos a la vez (dentro del mismo grupo o groupname).

RADIOBUTTONLIST:

Prog11.aspx

<HTML>
<FORM RUNAT=SERVER>
SEXO:<BR>
<ASP:RADIOBUTTONLIST ID=SEXO RUNAT=SERVER>
<ASP:LISTITEM TEXT=MASCULINO RUNAT=SERVER />
<ASP:LISTITEM TEXT=FEMENINO RUNAT=SERVER />
<ASP:LISTITEM TEXT=NEUTRO RUNAT=SERVER />
</ASP:RADIOBUTTONLIST>
<ASP:BUTTON ONCLICK=SELECCIONAR TEXT=OK RUNAT=SERVER /><BR>
<ASP:LABEL ID=SEX RUNAT=SERVER /><BR>
</FORM></HTML>
<SCRIPT LANGUAGE=JSCRIPT RUNAT=SERVER>
function SELECCIONAR (sender: Object, e: EventArgs):void
{
// como es un control similar a listbox,
// tambien puede usar prop selecteditem
SEX.Text = SEXO.SelectedItem.Text;
}
</script>
</html>

Igual que checkboxlist es decir agregarle un ID al radiobutonlist, y un monton de listitem's y programarlo con la propiedad selecteditem que queda apuntando al radiobuton que seleciono el usuario.

Corrida prog11.aspx

image412.jpg

TAREAS PROGRAMACION JSCRIPT

1.- CONSTRUIR UN CUESTIONARIO DE 6 PREGUNTAS SOBRE LOS HABITOS DE ESTUDIO DE UN ESTUDIANTE Y PASAR SUS RESPUESTAS Abajo(radiobuton y aspx).

2.- EVALUAR UNA FUNCION CUALESQUIERA para los valores de Y= 3, -5, 10

radiobuttonlist y js.

Politica de Privacidad