springMVC和jquery的ajax实现

最新推荐文章于 2021-08-25 21:08:25 发布

最新推荐文章于 2021-08-25 21:08:25 发布 · 120 阅读

文章标签：

#Ajax #jQuery #JSP #HTML #工作 #ViewUI

本文介绍了一个使用SpringMVC实现的动态按钮展示功能。通过AJAX请求，根据选择的流程类型，从服务器获取并显示相应的按钮配置。涉及前端JavaScript交互及后端控制器处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

以前struts2,struts1和jquery都这样写的，今天写了一个springMVC的实现，注意返回页面不要是tiles页面就OK
addOutSysOfButtons.js
$(document).ready(function(){

$("#sortId").change(function() {
var sortId=$("#sortId").val();
$.ajax({
type: "POST",
url: "pageButtonController.do",
data: "method=shouButtons&sortId="+sortId,
dataType: 'html',
success: function(result) {
alert(result);
$('#buttonShow').html(result)
}
});

});
jsp页面
<%@ include file="/common.jsp" %>
<script language='javascript' src='<c:url value="/js/addOutSysOfButtons.js"/>'></script>
<div class="error" id="error">
</div>
<form name="addOutSysOfButtons" method="post" action="<c:url value='/pageButtonController.do?method=addOutSysOfButtons'/>">

<table>
<tr>
<th >接入系统名称:</th>
<td>
<select id="system" name="system" style="width:100px">
<option value="">请选择</option>
<option value="a_system">a_sistem</option>
<option value="b_system">a_sistem</option>
</select>

</td>
</tr>
<tr>
<th >流程类型:</th>
<td>
<select id="sortId" name="sortId" style="width:100px">
<option value="">请选择</option>
<option value="1">固定流程</option>
<option value="2">动态流程</option>
</select>
</td>
</tr>
<tr>
<th >签报类型:</th>
<td>
<select id="taskType" name="taskType" style="width:100px">
<option value="">请选择</option>
<option value="1">内部工作签报</option>
<option value="2">红头文件拟稿</option>
</select>
</td>
</tr>
<tr>
<th >需要配置的按钮:</th>
<td id="buttonShow">

</td>
</tr>

</table>
<div id="abcd"></div>
</form>
PageButtonController
public class PageButtonController extends AbstractController{
private String outSysOfButtonsView;

protected ModelAndView handleRequestInternal(HttpServletRequest arg0, HttpServletResponse arg1) throws Exception {
String method=arg0.getParameter("method");
String sysId=arg0.getParameter("sysId");
String sortId=arg0.getParameter("sortId");
String taskType=arg0.getParameter("taskType");
ServiceRequest request = new ServiceReque();
Map returnMap=null;
if("shouButtons".equals(method)){
request.setRequestedServiceID("ShowButtonsAction");
request.setParameter("sortId", sortId);
ServiceResponse response = dispatchService(request,
WebContextNames.PAFA_AC);
returnMap = response.getModel();
outSysOfButtonsView="shouButtons";
}

return new ModelAndView(outSysOfButtonsView,returnMap);

}

}
只为测试用
返回页面shouButtons.jsp
<h1>showButton</h1>