Jquery UI Dialog 之 Form 表单提交

我就不介绍Jquery UI Dialog了，不过其中的一些属性可以到这里去找：http://www.cnblogs.com/bestfc/archive/2009/06/08/1498742.html。 比较全面喔。（我也是在这里看的，哈哈。）

至于需要引入什么文件，我的不说了。给个网站:http://www.cnblogs.com/haogj/archive/2011/02/16/1956267.html（我真的很懒。）

我专注的是Dialog的Form表单提交的问题。

不知道大家使用Dialog的方式是什么，我就说说我用的方式吧。

1. <div id="dialog">  
2.         <form id="dialogForm" method="post" action="user/add">  
3.             <table>  
4.                 <tr>  
5.                     <td>名字：</td>  
6.                     <td>  
7.                         <input type="text" name="name"/>  
8.                     </td>  
9.                 </tr>  
10.                 <tr>  
11.                     <td>年龄：</td>  
12.                     <td>  
13.                         <input type="text" name="age"/>  
14.                     </td>  
15.                 </tr>  
16.             </table>  
17.         </form>  
18.     </div>  

<div id="dialog">
		<form id="dialogForm" method="post" action="user/add">
			<table>
				<tr>
					<td>名字：</td>
					<td>
						<input type="text" name="name"/>
					</td>
				</tr>
				<tr>
					<td>年龄：</td>
					<td>
						<input type="text" name="age"/>
					</td>
				</tr>
			</table>
		</form>
	</div>

1. $("#dialog").dialog({  
2.             modal: true,  
3.             autoOpen: false,  
4.             buttons:{  
5.                 "确定":function(){  
6.                     var form = $("#dialogForm");  
7.                     $.ajax({  
8.                         url:form.attr('action'),  
9.                         type:form.attr('method'),  
10.                         data:form.serialize(),  
11.                         dataType:"json",  
12.                         success:function(data){  
13.                             $("#dialog").dialog("close");  
14.                             alert("成功啦");  
15.                         },  
16.                         error:function(){  
17.                             $("#dialog").dialog("close");  
18.                             alert("出错了哦");  
19.                         }  
20.                     }  
21.                 },  
22.                 "关闭": function() {  
23.                     $("#dialog").dialog("close");  
24.                 }  
25.             }  
26.         });  

$("#dialog").dialog({
			modal: true,
			autoOpen: false,
			buttons:{
				"确定":function(){
					var form = $("#dialogForm");
					$.ajax({
	        			url:form.attr('action'),
	        			type:form.attr('method'),
	        			data:form.serialize(),
	        			dataType:"json",
	        			success:function(data){
	        				$("#dialog").dialog("close");
	        				alert("成功啦");
	        			},
	        			error:function(){
	        				$("#dialog").dialog("close");
	        				alert("出错了哦");
	        			}
					}
				},
				"关闭": function() {
					$("#dialog").dialog("close");
				}
			}
		});

就这样,直接将form写在div里面就可以了. 然后form.serialize()获得到所有数据。就ok啦，挺容易的。