SlideShare a Scribd company logo
1 of 4
Colegio nacional nicolas esguerra
Julián Castiblanco
905
FORMULARIOS
Formulario <form>
Un formulario es un elemento que permite recogerdatos introducidos porel usuario.
Los formularios se utilizan para conocerlas opiniones,dudas,yotra serie de datos
sobre los usuarios,para introducir pedidos a través de la red, tienen multitud de
aplicaciones.
Un formulario está formado, entre otras cosas,poretiquetas, campos de texto, menús
desplegables,y botones.
Es muy recomendable utilizar tablas para organizarlos elementos de los formularios.
Utilizando tablas se consigue una mejordistribución de los elementos delformulario,
lo que facilita su comprensión ymejora su apariencia.
Los formularios se insertan a través de las etiquetas <form> y </form>. Entre dichas
etiquetas habrá que insertar los diferentes objetos que formarán el formulario. la
etiqueta <form> tiene los siguientes atributos:
El atributo action indica una dirección de correo electrónico a la que mandarel
formulario, o la dirección delprograma que se encargará de procesarelcontenido del
formulario.
El atributo enctype indica el modo en que será cifrada la información para su envío.
Por defecto tiene el valor application/x-www-form-urlencoded.
El atributo method indica el metodo mediante el que se transferirán las variables del
formulario. Su valor puede sergeto post.
El valor get se utiliza cuando no se van a producircambios en ningún documento o
programa que no sea elnavegadordelusuario que pretende mandarelformulario,
como ocurre cuando se realizan consultas sobre una base de datos.
El valor post se utiliza cuando síse van a producircambios,como ocurre cuando el
usuario manda datos que deben seralmacenados en una basede datos.
Se recomienda utilizar el valor post.
Por ejemplo,podríamos insertar un formulario escribiendo elsiguiente código:
<form action="mailto:formularios@aulaclic.com" method="post"enctype="text/
plain">
...
</form>
Áreas de texto <textarea>
Las áreas de texto permiten a los usuarios insertarvarias líneas de texto. Por ello,
suelen utilizarse para que incluyan comentarios.
Para insertar un área de texto es necesario incluirlas etiquetas <textarea> y
</textarea> entre las etiquetas <form> y </form> del formulario.
Para que el área de texto tenga algún valor inicial, habrá que insertarlo entre las
etiquetas <textarea> y </textarea>.
El atributo name indica el nombre delárea de texto. Es necesario darnombres
diferentes a cada uno de los elementos de un formulario, para poderidentificarlos a la
hora de procesarlos.
El atributo rows indica el número de líneas que podrán servisualizadas en elárea de
texto por lo que determina al alto del área de texto.
El atributo cols indica el número de caracteres porlínea que podrán servisualizados
en el área de texto por lo que determina al ancho delárea de texto.
Gracias a las barras de desplazamiento,es posible insertar más líneas de las
especificadas en el atributo rows, y más caracteres porlínea de los especificados en
el atributo cols.
Por ejemplo,para insertar el área de texto:
Habría que escribir:
<textarea name="ejemploarea"cols="30"rows="3">Escribe el texto que
quieras</textarea>
Elementos de entrada <input>
Para insertar un elemento de entrada es necesario incluirla etiqueta <input> entre las
etiquetas <form> y </form> del formulario.
El atributo name indica el nombre que se desea daralelemento de entrada,mediante
el cual será evaluado,y el atributo type indica el tipo de elemento de entrada.
Vamos a ver los diferentes tipos de elementos de entrada,y el resto de atributos que
pueden definirse para cada uno de ellos.
Campo de texto:
Para insertar un campo de texto, el atributo type debe tener el valor text.
El atributo size indica el número de caracteres que podrán servisualizados en el
campo de texto, determina el ancho de la caja.
El atributo maxlenghtindica el número de caracteres que podrán serinsertados en el
campo de texto.
El atributo value indica el valor inicial delcampo de texto.
Por ejemplo,para insertar el campo de texto:
Habría que escribir:
<input name="campo"type="text"value="Campo de
texto"size="20"maxlength="15">
Campo de contraseña:
Para insertar un campo de contraseña,elatributo type debe tenerel valor password.
El resto de atributos son los mismos que para un campo de texto normal. La única
diferencia es que todas las letras escritas en el campo de contraseña serán
visualizadas como asteriscos.
Por ejemplo,para insertar el campo de contraseña:
Habría que escribir:
<input name="contra"type="password"value="contraseña"size="20"maxlengt
h="15">

More Related Content

What's hot

What's hot (19)

10 formulario
10 formulario10 formulario
10 formulario
 
Reglas y texto de validación en access
Reglas y texto de validación en accessReglas y texto de validación en access
Reglas y texto de validación en access
 
Propiedad y regla de validacion
Propiedad y regla de validacionPropiedad y regla de validacion
Propiedad y regla de validacion
 
Papa
PapaPapa
Papa
 
Formularios HTML
Formularios HTMLFormularios HTML
Formularios HTML
 
ATIX22
ATIX22ATIX22
ATIX22
 
Ejercicios visual fox
Ejercicios visual foxEjercicios visual fox
Ejercicios visual fox
 
TITULAR ACCES.
TITULAR ACCES.TITULAR ACCES.
TITULAR ACCES.
 
Login C sharp
Login C sharpLogin C sharp
Login C sharp
 
Formularios HTML
Formularios HTMLFormularios HTML
Formularios HTML
 
Codigos de mascaras y tipos de vista de
Codigos de mascaras y tipos de vista deCodigos de mascaras y tipos de vista de
Codigos de mascaras y tipos de vista de
 
Tarea sql
Tarea sqlTarea sql
Tarea sql
 
Basededatos
BasededatosBasededatos
Basededatos
 
Ejemplo LOGIN conectado a una base de datos
Ejemplo LOGIN conectado a una base de datosEjemplo LOGIN conectado a una base de datos
Ejemplo LOGIN conectado a una base de datos
 
Pasos Para Conectar Una Base De Datos En Visual Basic
Pasos Para Conectar Una Base De Datos En Visual BasicPasos Para Conectar Una Base De Datos En Visual Basic
Pasos Para Conectar Una Base De Datos En Visual Basic
 
Entorno de trabajo
Entorno de trabajoEntorno de trabajo
Entorno de trabajo
 
Fichas de html 2014
Fichas de html 2014Fichas de html 2014
Fichas de html 2014
 
Control ficha y campos calculados
Control ficha y campos calculadosControl ficha y campos calculados
Control ficha y campos calculados
 
Unidad 4
Unidad 4Unidad 4
Unidad 4
 

Viewers also liked

Family history part 2
Family history part 2Family history part 2
Family history part 2alfredo_v11
 
B4 book 09 - ana carolina
B4   book 09 - ana carolinaB4   book 09 - ana carolina
B4 book 09 - ana carolinaGerson Moura
 
Fiche technique suspendu compact Prima Style par Allia salle de bains
Fiche technique suspendu compact Prima Style par Allia salle de bainsFiche technique suspendu compact Prima Style par Allia salle de bains
Fiche technique suspendu compact Prima Style par Allia salle de bainsAllia_Salle_De_Bains
 
دينار تسعة أعشار
دينار تسعة أعشاردينار تسعة أعشار
دينار تسعة أعشارAli Abo Al-hasan
 
REAL ESTATE REGULATORY AUTHORITY
REAL ESTATE REGULATORY AUTHORITYREAL ESTATE REGULATORY AUTHORITY
REAL ESTATE REGULATORY AUTHORITYAdvocate Selvakumar
 
Fiche technique meubles Prima Style par Allia salle de bains.
Fiche technique meubles Prima Style par Allia salle de bains.Fiche technique meubles Prima Style par Allia salle de bains.
Fiche technique meubles Prima Style par Allia salle de bains.Allia_Salle_De_Bains
 
Home of One’s Own: Women’s Property Rights and HIV/AIDS
Home of One’s Own: Women’s Property Rights and HIV/AIDSHome of One’s Own: Women’s Property Rights and HIV/AIDS
Home of One’s Own: Women’s Property Rights and HIV/AIDSMEASURE Evaluation
 
Reverse Mortgage Truth
Reverse Mortgage Truth Reverse Mortgage Truth
Reverse Mortgage Truth Michael Pinter
 
Feminization of poverty
Feminization of povertyFeminization of poverty
Feminization of povertyApril Treible
 
How to successfully implement ISO 9001:2015 with a minimal documents approach
How to successfully implement ISO 9001:2015 with a minimal documents approachHow to successfully implement ISO 9001:2015 with a minimal documents approach
How to successfully implement ISO 9001:2015 with a minimal documents approachPECB
 
Curso de-reparacion-de-telefonos-celulares
Curso de-reparacion-de-telefonos-celularesCurso de-reparacion-de-telefonos-celulares
Curso de-reparacion-de-telefonos-celularesBrianda Yuriar
 
Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...
Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...
Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...Allia_Salle_De_Bains
 
Franklin Restaurant Group Company Profile
Franklin Restaurant Group Company ProfileFranklin Restaurant Group Company Profile
Franklin Restaurant Group Company ProfileEmma McAdams
 

Viewers also liked (17)

Family history part 2
Family history part 2Family history part 2
Family history part 2
 
B4 book 09 - ana carolina
B4   book 09 - ana carolinaB4   book 09 - ana carolina
B4 book 09 - ana carolina
 
3
33
3
 
CodeYeti analysis Entrepreneurs problems about getting initial traction
CodeYeti analysis Entrepreneurs problems about getting initial tractionCodeYeti analysis Entrepreneurs problems about getting initial traction
CodeYeti analysis Entrepreneurs problems about getting initial traction
 
informatica 1
informatica 1informatica 1
informatica 1
 
Fiche technique suspendu compact Prima Style par Allia salle de bains
Fiche technique suspendu compact Prima Style par Allia salle de bainsFiche technique suspendu compact Prima Style par Allia salle de bains
Fiche technique suspendu compact Prima Style par Allia salle de bains
 
دينار تسعة أعشار
دينار تسعة أعشاردينار تسعة أعشار
دينار تسعة أعشار
 
REAL ESTATE REGULATORY AUTHORITY
REAL ESTATE REGULATORY AUTHORITYREAL ESTATE REGULATORY AUTHORITY
REAL ESTATE REGULATORY AUTHORITY
 
Fiche technique meubles Prima Style par Allia salle de bains.
Fiche technique meubles Prima Style par Allia salle de bains.Fiche technique meubles Prima Style par Allia salle de bains.
Fiche technique meubles Prima Style par Allia salle de bains.
 
Home of One’s Own: Women’s Property Rights and HIV/AIDS
Home of One’s Own: Women’s Property Rights and HIV/AIDSHome of One’s Own: Women’s Property Rights and HIV/AIDS
Home of One’s Own: Women’s Property Rights and HIV/AIDS
 
Reverse Mortgage Truth
Reverse Mortgage Truth Reverse Mortgage Truth
Reverse Mortgage Truth
 
Introduction to global business cia 1
Introduction to global business cia   1Introduction to global business cia   1
Introduction to global business cia 1
 
Feminization of poverty
Feminization of povertyFeminization of poverty
Feminization of poverty
 
How to successfully implement ISO 9001:2015 with a minimal documents approach
How to successfully implement ISO 9001:2015 with a minimal documents approachHow to successfully implement ISO 9001:2015 with a minimal documents approach
How to successfully implement ISO 9001:2015 with a minimal documents approach
 
Curso de-reparacion-de-telefonos-celulares
Curso de-reparacion-de-telefonos-celularesCurso de-reparacion-de-telefonos-celulares
Curso de-reparacion-de-telefonos-celulares
 
Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...
Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...
Catalogue pièces détachées N1 : WC au sol et suspendus, réservoirs de chasse,...
 
Franklin Restaurant Group Company Profile
Franklin Restaurant Group Company ProfileFranklin Restaurant Group Company Profile
Franklin Restaurant Group Company Profile
 

Similar to Formularios (20)

Formularios 1
Formularios 1Formularios 1
Formularios 1
 
Formularios 1
Formularios 1      Formularios 1
Formularios 1
 
Formularios
FormulariosFormularios
Formularios
 
Perez y sus cartas
Perez y sus cartasPerez y sus cartas
Perez y sus cartas
 
Nicolás es guerra
Nicolás es guerraNicolás es guerra
Nicolás es guerra
 
Curso HTML 5 & jQuery - Leccion 4
Curso HTML 5 & jQuery - Leccion 4Curso HTML 5 & jQuery - Leccion 4
Curso HTML 5 & jQuery - Leccion 4
 
Trabajo2015
Trabajo2015Trabajo2015
Trabajo2015
 
Frames y formularios en html
Frames y formularios en htmlFrames y formularios en html
Frames y formularios en html
 
Guía Formulario
Guía FormularioGuía Formulario
Guía Formulario
 
Formulario
FormularioFormulario
Formulario
 
Formularios y Validaciones
Formularios y ValidacionesFormularios y Validaciones
Formularios y Validaciones
 
Doc1
Doc1Doc1
Doc1
 
INTRODUCCIÓN A HTML – XHTML – Clase 03
INTRODUCCIÓN A HTML – XHTML – Clase 03INTRODUCCIÓN A HTML – XHTML – Clase 03
INTRODUCCIÓN A HTML – XHTML – Clase 03
 
Html 5: formularios
Html 5: formulariosHtml 5: formularios
Html 5: formularios
 
Presentacion De Formularios 1
Presentacion De Formularios 1Presentacion De Formularios 1
Presentacion De Formularios 1
 
5 formularios - javascript
5   formularios - javascript5   formularios - javascript
5 formularios - javascript
 
Formularios web
Formularios webFormularios web
Formularios web
 
Formularios
FormulariosFormularios
Formularios
 
Clase 1 Plataforma introducción a Diseño Web
Clase 1 Plataforma introducción a Diseño WebClase 1 Plataforma introducción a Diseño Web
Clase 1 Plataforma introducción a Diseño Web
 
Introducción a Javascript: Formularios
Introducción a Javascript: FormulariosIntroducción a Javascript: Formularios
Introducción a Javascript: Formularios
 

More from AndresJulian32 (20)

n96b
n96bn96b
n96b
 
Trabajo NXT
Trabajo NXTTrabajo NXT
Trabajo NXT
 
Laberinto NXT
Laberinto NXTLaberinto NXT
Laberinto NXT
 
NXT Sensores
NXT SensoresNXT Sensores
NXT Sensores
 
Trabajo
TrabajoTrabajo
Trabajo
 
Formato - Excel 2010
Formato - Excel 2010Formato - Excel 2010
Formato - Excel 2010
 
Marcos y menu
Marcos y menuMarcos y menu
Marcos y menu
 
Marcos
MarcosMarcos
Marcos
 
Marcos HTML
Marcos HTMLMarcos HTML
Marcos HTML
 
Marcos HTML
Marcos HTMLMarcos HTML
Marcos HTML
 
.
..
.
 
Trabajo HTML
Trabajo HTMLTrabajo HTML
Trabajo HTML
 
Trabaji HTML
Trabaji HTMLTrabaji HTML
Trabaji HTML
 
Base de datos access 2010
Base de datos access 2010Base de datos access 2010
Base de datos access 2010
 
Trabajo de Normas Icontec
Trabajo de Normas IcontecTrabajo de Normas Icontec
Trabajo de Normas Icontec
 
Trabajo de Empresa.
Trabajo de Empresa.Trabajo de Empresa.
Trabajo de Empresa.
 
Trabajo de Normas Icontec
Trabajo de Normas IcontecTrabajo de Normas Icontec
Trabajo de Normas Icontec
 
Trabajo de Normas Icontec
Trabajo de Normas IcontecTrabajo de Normas Icontec
Trabajo de Normas Icontec
 
trabajo de Normas Icontec
trabajo de Normas Icontectrabajo de Normas Icontec
trabajo de Normas Icontec
 
trabajo de Normas Icontec
trabajo de Normas Icontectrabajo de Normas Icontec
trabajo de Normas Icontec
 

Formularios

  • 1. Colegio nacional nicolas esguerra Julián Castiblanco 905 FORMULARIOS Formulario <form> Un formulario es un elemento que permite recogerdatos introducidos porel usuario. Los formularios se utilizan para conocerlas opiniones,dudas,yotra serie de datos sobre los usuarios,para introducir pedidos a través de la red, tienen multitud de aplicaciones. Un formulario está formado, entre otras cosas,poretiquetas, campos de texto, menús desplegables,y botones. Es muy recomendable utilizar tablas para organizarlos elementos de los formularios. Utilizando tablas se consigue una mejordistribución de los elementos delformulario, lo que facilita su comprensión ymejora su apariencia. Los formularios se insertan a través de las etiquetas <form> y </form>. Entre dichas etiquetas habrá que insertar los diferentes objetos que formarán el formulario. la etiqueta <form> tiene los siguientes atributos: El atributo action indica una dirección de correo electrónico a la que mandarel formulario, o la dirección delprograma que se encargará de procesarelcontenido del formulario. El atributo enctype indica el modo en que será cifrada la información para su envío. Por defecto tiene el valor application/x-www-form-urlencoded. El atributo method indica el metodo mediante el que se transferirán las variables del formulario. Su valor puede sergeto post. El valor get se utiliza cuando no se van a producircambios en ningún documento o programa que no sea elnavegadordelusuario que pretende mandarelformulario, como ocurre cuando se realizan consultas sobre una base de datos.
  • 2. El valor post se utiliza cuando síse van a producircambios,como ocurre cuando el usuario manda datos que deben seralmacenados en una basede datos. Se recomienda utilizar el valor post. Por ejemplo,podríamos insertar un formulario escribiendo elsiguiente código: <form action="mailto:formularios@aulaclic.com" method="post"enctype="text/ plain"> ... </form> Áreas de texto <textarea> Las áreas de texto permiten a los usuarios insertarvarias líneas de texto. Por ello, suelen utilizarse para que incluyan comentarios. Para insertar un área de texto es necesario incluirlas etiquetas <textarea> y </textarea> entre las etiquetas <form> y </form> del formulario. Para que el área de texto tenga algún valor inicial, habrá que insertarlo entre las etiquetas <textarea> y </textarea>. El atributo name indica el nombre delárea de texto. Es necesario darnombres diferentes a cada uno de los elementos de un formulario, para poderidentificarlos a la hora de procesarlos. El atributo rows indica el número de líneas que podrán servisualizadas en elárea de texto por lo que determina al alto del área de texto. El atributo cols indica el número de caracteres porlínea que podrán servisualizados en el área de texto por lo que determina al ancho delárea de texto. Gracias a las barras de desplazamiento,es posible insertar más líneas de las especificadas en el atributo rows, y más caracteres porlínea de los especificados en el atributo cols. Por ejemplo,para insertar el área de texto:
  • 3. Habría que escribir: <textarea name="ejemploarea"cols="30"rows="3">Escribe el texto que quieras</textarea> Elementos de entrada <input> Para insertar un elemento de entrada es necesario incluirla etiqueta <input> entre las etiquetas <form> y </form> del formulario. El atributo name indica el nombre que se desea daralelemento de entrada,mediante el cual será evaluado,y el atributo type indica el tipo de elemento de entrada. Vamos a ver los diferentes tipos de elementos de entrada,y el resto de atributos que pueden definirse para cada uno de ellos. Campo de texto: Para insertar un campo de texto, el atributo type debe tener el valor text. El atributo size indica el número de caracteres que podrán servisualizados en el campo de texto, determina el ancho de la caja. El atributo maxlenghtindica el número de caracteres que podrán serinsertados en el campo de texto. El atributo value indica el valor inicial delcampo de texto. Por ejemplo,para insertar el campo de texto: Habría que escribir: <input name="campo"type="text"value="Campo de texto"size="20"maxlength="15">
  • 4. Campo de contraseña: Para insertar un campo de contraseña,elatributo type debe tenerel valor password. El resto de atributos son los mismos que para un campo de texto normal. La única diferencia es que todas las letras escritas en el campo de contraseña serán visualizadas como asteriscos. Por ejemplo,para insertar el campo de contraseña: Habría que escribir: <input name="contra"type="password"value="contraseña"size="20"maxlengt h="15">