使用Spring MVC时如何在不刷新整个页面的情况下重新加载HTML表

Z时代
2024-01-10
分类：问答

我正在使用带有Javascript的Spring MVC example.jsp文件。

我已经坚持了很长时间。

是否可以使用Javascript将数据库中的新数据转换为HTML表，而无需刷新整个页面？

当某些事件将新数据加载到表中时，我只是不希望替换整个页面。

回答：

如果要使用JavaScript重新加载页面的一部分，基本上是AJAX。

这就是你应该怎么做。

回答：

假设您使用jQuery作为JavaScript框架。

您需要在客户端使用jQuery.ajax（）。

var successHandler = function( data, textStatus, jqXHR ) {
  // After success reload table with JavaScript
  // based on data...
};
var errorHandler = function( jqXHR, textStatus, errorThrown ) {
  // Error handler. AJAX request failed.
  // 404 or KO from server...
  alert('Something bad happened while reloading the table.');
};
var reloadData = function() { 
  // Process your request
  var request = new Object();
  request.id = 'some id'; // some data
  // Make the AJAX call
  jQuery.ajax({
    type       : 'POST',
    url        : 'http://domain/context/reload-data-url',
    contentType: 'application/json',
    data       : JSON.stringify(request)
    success    : successHandler,
    error      : errorHandler
  });
};

reloadData()需要重新加载表时调用该函数。

回答：

您正在使用Spring MVC。然后，您的控制器应如下所示：

 // Spring MVC Controller
 @Controller
 public class ReloadDataController {
   // Request Mapping
   @RequestMapping(value = '/reload-data-url', method = RequestMethod.POST)
   @ResponseBody
   public ResponseEntity<String> processReloadData(@RequestBody String body) {
     // Get your request
     JSONObject request = new JSONObject(body);
     String id = request.getString("id"); // Here the value is 'some id'
     // Get the new data in a JSONObject
     JSONObject response = new JSONObject();
     // build the response...
     // Send the response back to your client
     HttpHeaders headers = new HttpHeaders();
     headers.add("Content-Type", "application/json; charset=utf-8");
     return new ResponseEntity<String>(response.toString(),
                headers, HttpStatus.OK);
   }
 }