Jquery UI Dialog 之 Form 表单交付

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的方式是什么，我就说说我用的方式吧。

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

$("#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啦，挺容易的。

之前在这个问题上纠结了挺久，看看国外的网站说的都是一些另类玩意，不方便也不实用。自己摸索摸索就出来啦。

有什么不懂的欢迎留言。