Heim  >  Artikel  >  Web-Frontend  >  ajax+springmvc implementiert die Datenaustauschmethode zwischen C und View

ajax+springmvc implementiert die Datenaustauschmethode zwischen C und View

亚连
亚连Original
2018-05-22 16:21:581543Durchsuche

Jetzt bringe ich Ihnen einen Artikel darüber, wie Sie den Datenaustausch zwischen C und View mithilfe von Ajax + Springmvc implementieren. Lassen Sie mich es jetzt mit Ihnen teilen und es allen als Referenz geben.

jQuery.post(url, [data], [callback], [type])

url,[data],[callback],[type]String,Map,Function,StringV1 .0url: Anfrageadresse senden.

Daten: Zu sendende Schlüssel-/Wertparameter.

Rückruf: Rückruffunktion bei erfolgreichem Versand.

Typ: Inhaltsformat zurückgeben, XML, HTML, Skript, JSON, Text, _default.

Format:

$.post("test.php", function(data){
  alert("Data Loaded: " + data);
 });

$.get("comment/getComments?parentId="+parentId+"&topicId="+topicId,function(data){
 var appendButton ="";
 var append = "";
 if(data!=""){
  var arr = data.split("$");
  var allTr="";
  for(var i = 0;i<arr.length;i++){
  var arr2 = arr[i].split(&#39;,&#39;);
  var name = arr2[3];
  var content = arr2[0];
  var time= "/Date("+arr2[1]+")/";
  time = DateFormat(time);
  var id = arr2[2];
  var table = "<table><tr><td>"+content+"</td></tr><tr><td>"+time+"</td></tr></table>";
  appendButton = appendButton+table+"<button type = &#39;button&#39; id = &#39;toAddCommentId&#39; onclick = &#39;replaceFrom("+parentId+",\""+name+"\""+")&#39;>回复</button>";
  }
  appendButton = appendButton+"<button type = &#39;button&#39; onclick = &#39;replaceFrom("+parentId+","+"\""+userName+"\""+")&#39;>我也说一句</button>";
 }
 appendButton = appendButton+"<p id = &#39;commentButton&#39; ></p><p id = &#39;textareaId&#39;></p>";
 if(data==""){
  appendButton = appendButton+"<textarea id=&#39;textareaId"+parentId+"&#39; rows=&#39;2&#39; cols=&#39;77&#39; validate=&#39;required&#39; validate-message=&#39;不能为空!&#39; name = &#39;content&#39; >@"+userName+"...."+"...."+parentId+":</textarea><button type = &#39;button&#39; id = &#39;commentContentId&#39; onclick = &#39;submit("+topicId+","+parentId+","+"\""+userName+"\""+")&#39;>发表</button>";
 }
 $("#addCommentId"+parentId).html(appendButton);
 });

Backend:

@RequestMapping(value = "/saveAndGetComments", params = {"topicId","parentId"}, method = RequestMethod.POST)
 @ResponseBody
 public String saveAndGetComments(long topicId,Comment comment,long parentId) throws UnsupportedEncodingException{
 comment.setParentId(parentId);
 commentService.save(comment,topicId);
 List<Comment> comments=commentService.listByCommentId(parentId);
 return append(comments);
 }
 
 private String append(List<Comment> comments) {
 StringBuffer sb=new StringBuffer();
 for(int i=0;i<comments.size();i++){
  Comment comment = comments.get(i);
  sb.append(comment.getContent());
  sb.append(",");
  sb.append(comment.getCreateTime().getTime());
  sb.append(",");
  sb.append(comment.getId());
  sb.append(",");
  sb.append(comment.getUser().getName());
  if(i!=comments.size()-1){
  sb.append("$");
  }
 }
 return sb.toString();
 }

Hinweis , verwenden Sie die SpringMVC3-Annotation @responseBody, um Parameter zu übergeben.

Häufig verwendete js-Funktionen:

Da json zum Übergeben der oben genannten Daten verwendet wird und js das von json übergebene Datum analysiert, liegt es nicht in dem von uns verwendeten Format vor wollen. Dann müssen Sie das Datum bearbeiten:

Übergeben Sie zuerst das vergangene Datum, setzen Sie es auf die Zeit und übergeben Sie es an date.getTime()

Dann arbeiten Sie in js :

var date= "/Date("+time+")/";
date = DateFormat(date);



/**
 * 处理时间
 * @param value
 * @returns {String}
 */
function DateFormat(value) {
  var date = new Date(parseInt(value.replace("/Date(", "").replace(")/", ""), 10));
  var month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
  var currentDate = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
  var Hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
  var Minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
  var Seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();

  return date.getFullYear() + "/" + month + "/" + currentDate + " " + Hours + ":" + Minutes + ":" + Seconds;
}

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

5 Ajax-Interaktionsmethoden zwischen Spring MVC Front-End und Back-End

Servlet meldet immer bei der Interaktion mit Ajax Lösung für status=parsererror

Verschiedene Gesten von Front-End-Ajax bei der Interaktion mit dem Back-End (grafisches Tutorial)

Das obige ist der detaillierte Inhalt vonajax+springmvc implementiert die Datenaustauschmethode zwischen C und View. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn