Enviar formulario Ajax
Descripción
Framework7 le permite enviar datos automáticamente usando Ajax usando las siguientes dos formas:
Cuando el usuario envía el formulario o el evento de envío se activa en el formulario mediante programación.
Cuando el usuario modifica cualquier campo de formulario o evento de cambio activado en el formulario mediante programación.
Enviar datos del formulario al enviar
Para habilitar el formulario Ajax y enviar los datos del formulario al hacer clic en Enviar, automáticamente, debe agregar la clase ajax-submit al formulario. Una vez que el usuario envía el formulario, Ajax enviará automáticamente los datos del formulario utilizando las siguientes reglas:
Los datos del formulario se enviarán al archivo o la URL mencionada en el atributo de acción del formulario.
El método de solicitud será similar al mencionado en el atributo de método del formulario.
El tipo de contenido será el mismo que se menciona en el atributo enctype del formulario. Si no se menciona de forma predeterminada, es application / x-www-form-urlencoded .
Enviar datos de formulario sobre el cambio de entrada
Podemos enviar los datos del formulario cuando el usuario realiza algún cambio en los campos del formulario utilizando la clase ajax-submit-onchange como se muestra a continuación:
<form action = "send.html" method = "GET" class = "ajax-submit-onchange">
...
</form>Cuando el usuario modifica cualquier campo de formulario, los datos del formulario se enviarán automáticamente usando Ajax con las mismas reglas que se discutieron anteriormente.
Evento de envío de Ajax
Para obtener una respuesta XHR real del archivo / URL donde envió los datos, puede usar eventos especiales como se muestra a continuación:
| S. No | Descripción del evento | objetivo |
|---|---|---|
| 1 | submitted Este evento se activará después de una solicitud Ajax exitosa. |
Elemento de formulario <form class = "ajax-submit"> |
| 2 | beforeSubmit Este evento se activará justo antes de la solicitud de Ajax. |
Elemento de formulario <form class = "ajax-submit"> |
| 3 | submitError Este evento se activará en caso de error de solicitud de Ajax. |
Elemento de formulario <form class = "ajax-submit"> |