Springboot通过jquery提交数据和跳转更新局部查询信息

前端代码

前端控件button id定义

<div class=\"ui action input\"><input type=\"text\" name=\"username\" placeholder=\"姓名\"><button id=\"search-btn\" type=\"button\" class=\"ui teal button\">搜索</button></div>

查询后需要更新的列表

<div id=\"table-container\" class=\"ui attached segment\"><table th:fragment=\"blogList\" class=\"ui orange center celled table\"...><!--blogList为局部需要更新的数据区域--></div>

javascript定义需要跳转的url和传输数据
参考$(selector).load(url,data,function(response,status,xhr))

<script>$(\'#search-btn\').click(function () {justdoit();});function  justdoit() {$(\"#table-container\").load(/*[[@{/main/search}]]*/\"/main/search\",{username : $(\"[name=\'username\']\").val()});}</script>

controller

@GetMapping(\"/main\")public String findAllUser(@RequestParam(required=true,defaultValue=\"1\") Integer page, Model model){PageHelper.startPage(page,3);List<User> userList=userService.findAllUser();PageInfo<User> pageInfo=new PageInfo<>(userList);model.addAttribute(\"user\",pageInfo);return  \"first\";}@PostMapping(\"/main/search\")public String search(@RequestParam(required=true,defaultValue=\"1\") Integer page,@RequestParam(\"username\") String username, Model model){PageHelper.startPage(page,3);List<User> userList=userService.findAllUserName(username);PageInfo<User> pageInfo=new PageInfo<>(userList);model.addAttribute(\"user\",pageInfo);return \"first ::blogList\";}