如何使用AJAX响应修改Spring mvc项目中的现有url？

我正在开发一个Spring MVC项目，其中主页有两个输入字段。 两个输入字段都是String类型。 但是regNo字段得到数字，如果用户输入regNo，它应该被带到控制器中的相应方法。 如果用户输入名称，则应将其转到控制器中的相应方法。

web.xml中

 <!-- Archetype Created Web Application -->  contextConfigLocation /WEB-INF/spring/appContext.xml   org.springframework.web.context.ContextLoaderListener    dispatcher org.springframework.web.servlet.DispatcherServlet   contextConfigLocation /WEB-INF/spring/dispatcher-servlet.xml  1   dispatcher /mvc/*   /WEB-INF/jsp/template.jsp   

1）id =“WebApp_ID”的目的是什么？

tiles.xml

调度员servlet.xml中

      <!--  -->    /WEB-INF/tiles.xml        org.springframework.web.servlet.view.tiles2.TilesView     

ProjectController.java

 @Controller("resultController") public class ResultController { private final ResultService resultService; @Autowired public ResultController(ResultService resultService) { this.resultService = resultService; } @RequestMapping(value ="/template", method = RequestMethod.GET) public String getPersonList(ModelMap model) { System.out.println("We are coming into this place"); return "header"; } @RequestMapping(value = "/search/s", method = RequestMethod.GET, params = { "regNo" }) public String getStudentResult(@RequestParam(value = "regNo", required = true) String regNo, ModelMap model){ System.out.println("I am coming here when I enter regNo and AJAX works"); model.addAttribute("studentResult",resultService.getStudentResult(regNo)); return "numberResult"; } @RequestMapping(value = "/search/l/studentName={studentName}", method = RequestMethod.GET, params = { "studentName" }) public String anotherMethod(String studentName, ModelMap model){ return "nameResult"; } } 

header.jsp中

     
   Search  
  function processInput(){ if (document.getElementById('regNo').value !=""){ $.ajax({ type : 'GET', url : "search/s", data : { "regNo":$("#regNo").val()}, success : function(studentResult) { //show your result // alert("Value"); $('#displayArea').html(studentResult); } }); }else if (document.getElementById('studentName').value !=""){ $.ajax({ type : 'GET', url : "search/l", data : { "studentName":$("#studentName").val(), success : function(result) { //show your result }} }); } }  

template.jsp

numberResult.jsp

2）用户在header.jsp中输入regNo，我希望结果显示在numberResult.jsp中

3）我的第一个url是localhost:8080/ProjectCtxt/mvc/template进入主页。 当我在输入字段中输入regNo时，浏览器中的我的URL显示localhost:8080/ProjectCtxt/mvc/template/regNo=123&studentName= 。 我正在访问getStudentResult方法，因为我可以在控制台中看到我的System.out，但我无法在浏览器中看到输出。

由于我使用的是瓷砖，我不确定问题是瓷砖解析器还是AJAX。 请你帮助我好吗？ 谢谢。

PS：如果可能的话，请回答所有问题，以便能帮助他人。 谢谢。

更新：我更改了我的header.jsp如下，现在我在UI中看到“numberResult”。 但我没有看到numberResult jsp是template.jsp的主体。 我想“numberResult”文本将返回到AJAX的成功部分。

      $(document).ready(function(){ $('#inputFields').click(function(){ processInput(); }); }); function processInput(){ if (document.getElementById('regNo').value !=""){ $.ajax({ type : 'GET', url : "search/s", data : { "regNo":$("#regNo").val()}, success : function(studentResult) { //show your result alert("Value"); $('#displayArea').html(studentResult); //this line displays text //"numberResult". But it doesn't change the jsp as well as the url. Now my url looks as //localhost:8080/mvc/template and the body of the jsp doesn't have numberResult.jsp } }); }else if (document.getElementById('studentName').value !=""){ $.ajax({ type : 'GET', url : "search/l", data : { "studentName":$("#studentName").val(), success : function(result) { //show your result }} }); } }  
 
 
 
 
  

Answer 1

尝试将anotation @ResponseBody放到您的控制器上

 @RequestMapping(value = "/search/s", method = RequestMethod.GET, params = { "regNo" }) @ResponseBody public String getStudentResult(@RequestParam(value = "regNo", required = true) String regNo, ModelMap model){ System.out.println("I am coming here when I enter regNo and AJAX works"); model.addAttribute("studentResult",resultService.getStudentResult(regNo)); return "success"; } 

Answer 2

编辑

好吧，我想我误解了最初的问题和预期的结果。 你的方法有几个问题。

1. 您正在尝试将AJAX事件附加到以非异步方式提交表单的按钮。
2. 您正尝试在JSP标记中显示来自AJAX请求的响应。

这两个问题都是不兼容组件的问题。 当您以非异步方式提交表单时，您正在请求浏览器加载的新页面，并且您的JavaScript没有时间来完成并显示结果。 JSP标记无法异步加载和显示，因为它们需要在服务器上进行处理。 这为您提供了两种可能的解决方案：

1.使过程完全异步。

删除表单标记，并保留输入和按钮：

   Search 

现在没有提交表单，因此您不必担心意外覆盖您的AJAXfunction。 更新JavaScript以读取输入值，执行正确的AJAX请求并显示结果：

 $("#searchButton").on("click", function(){ if ($('#regNo').val() !=""){ $.ajax({ type : 'GET', url : "search/s", data : { "regNo":$("#regNo").val()}, success : function(studentResult) { $('#displayArea').html("
" + studentResult.id + "
" + studentResult.name + "
etc...
); } }); }else if (document.getElementById('studentName').value !=""){ $.ajax({ type : 'GET', url : "search/l", data : { "studentName":$("#studentName").val(), success : function(result) { //show your result }} }); } }); 

确保处理AJAX方法的控制器设置为返回JavaScript可以理解的对象。 Spring应该能够序列化你给它的大多数对象：

 @RequestMapping(value = "/search/s", method = RequestMethod.GET, params = { "regNo" }) public @ResponseBody StudentResult getStudentResult(@RequestParam(value = "regNo") String regNo){ return resultService.getStudentResult(regNo); } 

2.使过程完全非异步

如果您设置使用JSP标记来显示数据，则可以废弃AJAX并以通常的方式提交表单：

 
   Search  

如果您希望表单POST或对其他URL执行GET，则可以提供action属性。 创建一个控制器方法来处理提交：

 @RequestMapping(value = "/someUrl", method = RequestMethod.POST) public String getStudentResult(@RequestParam(value = "regNo", required = false) String regNo, @RequestParam(value = "studentName", required = false) String studentName, ModelMap model){ if (regNo != null && !regNo.equals("")){ model.addAttribute("studentResult",resultService.getStudentResult(regNo)); return "numberResult"; } else if (studentName != null && !studentName.equals("")){ model.addAttribute("nameResult", someOtherObject); return "nameResult"; } else { model.addAttribute("errorMessage", "No form data supplied!"); return "someOtherView"; } } 

现在，只要您将视图设置为接受返回的对象并将它们映射到JSTL中，您的标记应该可以正常工作。