Unidad 8. Formularios (XII)

8.20. Tipo file

file. Con este tipo de entrada podemos seleccionar un archivo de nuestro ordenador o dispositivo. Los navegadores generan un botón con el texto "Seleccionar archivo" o "Examinar ..." y al pulsarlo se abre la interfaz del sistema para elegir un archivo de nuestro sistema. El archivo seleccionado aparecerá escrito al lado del botón, y se enviará en el correspondiente nombre de campo, sólo se envía el nombre del archivo, no la ruta completa, (ni el contenido del archivo).

Podemos limitar el tipo de archivos que permitimos seleccionar con el atributo accept indicando la lista de tipos de archivo o tipos MIME. Esta lista de tipos de archivo se puede dar en formato .xxx, o image/xxx, por ejemplo, accept=".jpeg, .png", o accept="image/jpg, image/jpeg, image/png". Otro ejemplo, para tipos de archivo de documentos de Word, sería accept=".doc, .docx".

Por ejemplo con el atributo accept=".jpg, .jpeg, .png":

<input type="file"  name="fichero"  accept=".jpg, .jpeg, .png"  />

8.21. Tipo image

image. Con este tipo de entrada podemos mostrar una imagen en el formulario con funciones de un botón. Al hacer clic en la imagen se enviará el formulario de forma similar a cuando pulsamos en el botón submit. Debemos dar el atributo src con la ruta donde se encuentra la imagen, también podemos dar otros atributos de las imágenes como width, height y alt para indicar el ancho, alto y mensaje alternativo respectivamente.

Por ejemplo, en el siguiente formulario hemos sustituido el botón submit por la imagen :

<form action="#" method="post" >
    <p>Nombre:
      <input type="text"  name="nombre" />
    </p>
    <p>
      <input type="image"  src="comunes/atras2.gif" />
    </p>
  </form>

Adicionalmente, siempre se envían las coordenadas del punto de la imagen donde se ha hecho clic con el ratón. Más adelante puedes ver un ejercicio paso a paso que utiliza esta característica, pero primero debes saber cómo recibir datos en PHP, por lo tanto el ejercicio lo encontrarás en el punto Recibir datos de un formulario.

 Cursos Informática Gratuitos