jEasyUI crée un formulaire de soumission asynchrone

Ce tutoriel vous montre comment soumettre un formulaire (Formulaire) via easyui. Nous créons un formulaire avec des champs nom, email et téléphone. Changez le formulaire en formulaire ajax en utilisant le plugin de formulaire easyui. Le formulaire soumet tous les champs au serveur backend, et le serveur traite et renvoie certaines données à la page frontend. Nous recevons les données de retour et les affichons.

Créer un formulaire (Formulaire)

	<div style="padding:3px 2px;border-bottom:1px solid #ccc">Ajax Form</div>
	<form id="ff" action="form1_proc.php" method="post">
		<table>
			<tr>
				<td>Name:</td>
				<td><input name="name" type="text"></input></td>
			</tr>
			<tr>
				<td>Email:</td>
				<td><input name="email" type="text"></input></td>
			</tr>
			<tr>
				<td>Phone:</td>
				<td><input name="phone" type="text"></input></td>
			</tr>
			<tr>
				<td></td>
				<td><input type="submit" value="Submit"></input></td>
			</tr>
		</table>
	</form>

Changer en formulaire Ajax

	$('#ff').form({
		success:function(data){
			$.messager.alert('Info', data, 'info');
		}
	});

Code côté serveur

	$name = $_POST['name'];
	$email = $_POST['email'];
	$phone = $_POST['phone'];

	echo "Your Name: $name <br/> Your Email: $email <br/> Your Phone: $phone";

Télécharger l'instance jQuery EasyUI

jeasyui-form-form1.zip