Use springboot not jump page

Record beginner springboot step on a little pit

First, I request direct access to the login page directly through the browser, project structure shown in Figure

 

 

•  log in page

 1 <form action="index" id="frm">
 2     <input type="text" name="dname">
 3     <input type="text" name="loc">
 4     <input type="button" value="提交" id="but" ></form>
 5 <script src="js/jquery-1.12.2.js"></script>
 6 <script>
 7     $(function () {
 8         $("#but").click(function(){
 9             var data = $("#frm").serialize();
10             $.get("index",data);
11 　　　　})
12     })
13 </script>

After clicking submit, is sending data inside a ajax form, request address index, which will go to the database queries whether this person (the back-end database queries using mybatis go), based on the results returned, jump to the corresponding page, and I java code index requested controller which is written as:

 1 //   登录
 2     @GetMapping("index")
 3     public String addDept(Dept dept) {
 4         log.info("dept===" + dept);
 5         List<Dept> depts = deptService.selectDept(dept);
 6         if (depts != null) {
 7             return "index";
 8         } else {
 9             return "error";
10         }
11     }

Unexpected thing happened with the query results came out, but also entered if the judge, but that is no jump pages, this problem puzzled for a long time, did not think the problem has been where a lot of Baidu, Baidu to which the result of the following points:

1. NOTE Using @Controller instead @RestController, because the use of @RestController will return "index" string
2. First introduced in the package template engine pom jar file, namely:
   
   <dependency>
      <the groupId> org.springframework.boot </ the groupId>
      <the artifactId> Starter-Spring-Boot-Thymeleaf </ the artifactId>
   </ dependency>
3. Configuration template engine in application.properties

   spring.thymeleaf.prefix=classpath:/templates/

4. @ResponseBody without comment, because it will return to form after a string of plus;

More of these pits, I have tried, but finally did not fail, but I input index requests directly in the browser, the page will jump to the top of the index.html go, I am very puzzled, and still do not know my problem where appears

My index.html page as follows, using ajax request, call to request a database query of all, the code is as follows:

 1 index页面
 2 <script src="../js/jquery-1.12.2.js"></script>
 3 <script>
 4    selectDept()
 5    function selectDept() {
 6        $.get("getDept",callSelectDept,"JSON")
 7        function callSelectDept(data) {
 8            var str=""
 9            for (var i =0;i<data.length;i++){
10                str+=data[i].deptno+"---"+data[i].dname+"---"+data[i].loc+
11                    "<a href=deleteDept?deptno='"+data[i].deptno+"'>删除</a>"+
12                    "<a href=updateDept?deptno='"+data[i].deptno+"'>修改</a>"
13                    +"<br/>"
14            }
15            $("#queryDept").append(str)
16        }
17    }

When index.html access through a browser, the data will be displayed, there is no problem

 

Later, over a period of time to it, just think of it is not ajax request after calling the method in java back-end page request is sent after the jump, can not jump pages, because the default is asynchronous ajax requests thing. Code as follows

 

1 $.ajax({
2                 asyn:false,
3                 url:"index",
4                 type:"get",
5                 data:data
6             })

 

Later, after the ajax request to change the synchronization, or failure, and finally, to submit the form was changed summit, success !!!

1 <form action="index" id="frm">
2     <input type="text" name="dname">
3     <input type="text" name="loc">
4     <input type="submit" value="提交" ></form>

 

Summary: ajax request only the best for sending data, and get data from back-end, do not jump page ... must be done if the page jump back into the back-end data may agree to 1 or 0, when the returned data is 1, with Windows.location.href = "index.html" to jump

Specific code as follows:

1 　　　　　　function callback(dat){
2               if (dat=1){
3                     window.location.href="index.html"
4                }else {
5                     alert("1")
6                 }

Otherwise submitted with submit, remember, ajax for after sending a request to that method, the back end is not the jump page, it will not error, because the default is asynchronous ajax requests, if you want to jump on the jump in the front also can turn the page

The pit is recorded for later give you some advice !!!