API Communication FormData() Este constructor retorna una objeto FormData usado luego por el método send() para enviar información. append(nombre, valor) Este método agrega datos al objeto FormData. Toma un par clave/valor como atributos. El atributo valor puede ser una cadena de texto o un blob. Los datos retornados representan un campo de formulario.
function iniciar(){ cajadatos=document.getElementById('cajadatos'); var boton=document.getElementById('boton'); boton.addEventListener('click', enviar, false); } function enviar(){ var datos=new FormData(); datos.append('nombre','Juan'); datos.append('apellido','Perez'); var url="procesar.php"; var solicitud=new XMLHttpRequest(); solicitud.addEventListener('load', mostrar, false); solicitud.open("POST", url, true); solicitud.send(datos); } function mostrar(e){ cajadatos.innerHTML=e.target.responseText; } window.addEventListener('load', iniciar, false); Listado 13-5. Enviando un formulario virtual.
Cuando la información es enviada al servidor, es con el propósito de procesarla y producir un resultado. Normalmente este resultado es almacenado en el servidor y algunos datos son retornados como respuesta al usuario. En el ejemplo del Listado 13-5, los datos son enviados al archivo procesar.php y la respuesta de este código es mostrada en pantalla. Para probar este ejemplo, el archivo procesar.php deberá imprimir los valores recibidos con un código similar al siguiente:
<?PHP print('Su nombre es: '.$_POST['nombre'].'<br>'); print('Su apellido es: '.$_POST['apellido']); ?> Listado 13-6. Respuesta simple a una solicitud POST (procesar.php).
283