jQuery EasyUI form - to create an asynchronous submission form

This tutorial shows you how to submit a form (Form) by easyui. We create a form name, email and phone fields with. By using easyui form (form) plug-in to change form (form) is ajax form (form). Form (form) to submit all the fields to the backend server, the server processing, and send some data back to the front page. We receive data back and show it out.

Create a form (Form)

	<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>

Changed to Ajax form

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

Server-side code

	$ Name = $ _POST [ 'name'];
	$ Email = $ _POST [ 'email'];
	$ Phone = $ _POST [ 'phone'];

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

Download jQuery EasyUI examples

jeasyui-form-form1.zip