我正在为表单使用Jquery ui标签。下面是我的代码的骨架。
<form id="1" method="post" class="main" action="myservlet">
<div id="tabs">
<ul>
<li><a href="xyz/ABC.jsp">NewEmployee</a> </li>
<li><a href="xyz/DEF.jsp">Add Leave</a> </li>
</ul>
</div>
</forms>
我的问题是我需要在一次点击按钮上提交两种形式的详细信息,我在ABC和DEF jsp中都没有表单。我在每个特定的jsp本身内部执行jsp的验证。
我在SOF中提到了一些帖子,但可以得到我想要的东西。任何帮助深表感谢。
更新1 Michael B建议的解决方案在两个不同的查询中以两个jsp发送数据。我希望两个数据都在同一个查询字符串上发送。由于第二个jsp数据依赖于第一个jsp信息的主键。 感谢
答案 0 :(得分:0)
不要在每个jsp页面(abc.js,def.jsp)中放置表单标签,并在标签页中处理form1的提交事件。
您需要将提交按钮放在最后一个标签的jsp页面中。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title> </title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function () {
$("#tabs").tabs({
beforeLoad: function (event, ui) {
ui.jqXHR.error(function () {
ui.panel.html("Couldn't load this tab.");
});
}
});
// handle submit of each form
$('#form1').submit( function (e) {
var form = $(this);
e.preventDefault();
$.ajax({
url: form.attr('action')
, type: form.attr('method')
, data: form.serialize()
, success: function (data) {
alert(data);
}
, error: function (jqXHR, textStatus, errorThrown) {
alert('Error:' + textStatus + ' - ' + errorThrown)
}
});
});
});
</script>
</head>
<body>
<form id="form1" method="post" class="main" action="myservlet">
<div id="tabs">
<ul>
<li>
<a href="1.htm">
Tab 1</a></li>
<li>
<a href="2.htm">
Tab 2</a></li>
</ul>
</div>
</form>
</body>
</html>
每个表单标记都应正确设置方法和操作属性!