jueves, 7 de noviembre de 2013

¿Cómo subir un formulario con Ajax Feedback

Formulario de retroalimentación se automatiza con las aplicaciones AJAX.

AJAX es una de las aplicaciones web más populares hoy en día debido a su capacidad de transformar las aplicaciones web más como aplicaciones de escritorio. AJAX tiene una funcionalidad que otras tecnologías no podrían llevar a cabo, tales como la integración completa con varios lenguajes de programación. También cuenta con otra aplicación web interactiva y actualización de contenidos web sin la necesidad de cargar toda la página web. Es capaz de hacer formularios en línea interactiva y funcional. TRATAR oxiuros Que pica



Utilice el siguiente código para crear un formulario con un nuevo comportamiento submit. Esta forma te puede llamar un JavaScript en lugar de que la presentación de los datos a una página diferente.

lenguaje de script type = "javascript" = "text / javascript"

/ / Esta función se llama cuando ha sido enviado el formulario

función saveData () {

/ / ...

return false ;/ / Prevenir la forma de ser submited

}

function init () {

. document.getElementById ("feedback_form") onsubmit = saveData; / / La función saveData se une a la acción de envío de la forma.

}

window.onload init = / / La función 'init' se llama cuando se carga la página.

/ Script



Inserte el siguiente código para crear algunas de las funciones de la biblioteca de AJAX y el nombre de su archivo "ajax_lib.js" o con cualquier cosa que usted desea:

var jx_http jx_getHTTPObject = () / / Creamos el objeto HTTP

/ / Crear un objeto XMLHttpRequest - este es el constructor.

función jx_getHTTPObject () {

var xmlhttp;

/ / Usar elementos ActiveX de IE para cargar el archivo.

if (typeof ActiveXObject! = "indefinido") {

try {

xmlhttp = new ActiveXObject ("Msxml2.XMLHTTP");

} Catch (e) {

try {

xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP");

} Catch (e) {

xmlhttp = false;

}

}

/ / Si ActiveX no está disponible, utilice el XMLHttpRequest de Firefox / Mozilla, etc para cargar el documento.

} Else if (XMLHttpRequest) {

try {

xmlhttp = new XMLHttpRequest ();

} Catch (e) {

xmlhttp = false;

}

} Else {

xmlhttp = false;

}

volver xmlhttp;

}

/ / Esta función se llama desde la escritura del usuario. Se necesitará una URL y una función de devolución de llamada opcional.

/ / A continuación, se leerá el archivo de URL, contar con una cadena JSON. Una vez que el archivo se carga, el guión

/ / Se pharse la cadena json usando 'eval' y llame a la función de devolución de llamada definido por el usuario con este

/ / Array como argumento.

/ / Argumentos -

/ / URL - La URL del script serverside que se va a llamar. Anexar todos los argumentos a

/ / Esto urls como GET params - como get_data.php id = 5p>

/ / Callback - Nombre de la función que se debe llamar una vez que los datos están listos. Si una devolución de llamada

/ / Función no está dada, entonces se utilizarán 'jx_processResults' La función predeterminada.

función jx_getData (URL, callback) {

si regreso (jx_http!);

jx_http.open ("GET", URL, true);

/ / Llamar a una función Anonymos cuando cambia el estado.

jx_http.onreadystatechange = function () {

if (jx_http.readyState == 4) {/ / Estado Ready será de 4 cuando se carga el documento.

resultado var;

if (jx_http.responseText) resultado = eval (jx_http.responseText) / / Sí, lo sé yo solía eval - es JSON, estúpido.

resultado otra = "";

if (callback) {

callback (resultado); / / Dar a los datos a la función definida por el usuario.

} Else {/ / Si no hay una función definida por el usuario ...

/ / Llamar a una función predifined con el resultado.

if (jx_processResults) jx_processResults (resultado);

}

}

}

jx_http.send (null);

}



Volver a la sección de encabezado e inserte el código siguiente para establecer su función principal AJAX:

lenguaje de script type = "javascript" = "text / javascript" src = "jx_lib.js" / script

lenguaje de script type = "javascript" = "text / javascript"

/ / Esta función se llama cuando ha sido enviado el formulario

función saveData () {

/ / ...

return false ;/ / Prevenir la forma de ser submited

}

function init () {

if (jx_http) {/ / Si el navegador es compatible con funciones de Ajax

. document.getElementById ("feedback_form") onsubmit = saveData; / / La función saveData se une a la acción de envío de la forma.

}

}

window.onload init = / / La función 'init' se llama cuando se carga la página.

/ Script



Aplicar el siguiente código para establecer el archivo "save_data.php" para pasar los resultados a insertar a la base de datos:

/ / Esta función se llama cuando se envía el formulario

función saveData () {

var comment = document.getElementById ("comment") de valor.;

var email = document.getElementById ("email") el valor.;

/ / Al llamar a este archivo, hemos guardado los datos.

jx_getData ("comentario save_data.php =" mensaje + + "correo +" e ");

/ / Muestra el mensaje de agradecimiento.

document.getElementById ("form_elements") innerHTML = "h1Feedback que Received/h1Thank por su interés - vamos a ver en su comentario tan pronto como sea posible.".;

return false ;/ / Prevenir la forma de ser presentado

}



Inserte el siguiente código para activar el formulario, conectarlo a su base de datos y obtener retroalimentación de AJAX:

Php

include ('/ connect.php.'); / / Conectar con la base de datos.

/ / Insertar datos en nuestra base de datos

mysql_query ("INSERT INTO retroalimentación (feedback_email, feedback_comment, feedback_time)

VALUES ('$ _REQUEST [email]', '$ _REQUEST [comentario] ", NOW ())") or die ("No se puede guardar:." Mysql_error ());

if ($ _REQUEST ['return'] == 'none') de salida; / / Exit sin imprimir la nota de agradecimiento.

?

HTML

cabeza

titleFeedback Recibido / title

/ Head

cuerpo

h1Feedback Received/h1

Gracias por su interés - vamos a ver en su comentario tan pronto como sea posible.

/ Cuerpo

/ Html

Consejos y advertencias

Siempre ponga la información lenguaje de script en la sección principal de la página para ser compatible con la mayoría de las páginas web publicadas en Internet. Utilice tutoriales en línea para obtener una comprensión básica de AJAX.

 

No hay comentarios:

Publicar un comentario