Wie aktualisiert man die JSP-Seite nach AJAX-Aktion

Question

Mein Problem ist, ich habe eine HTML-Tabelle in JSP-Seite. Und ich angewendet Drag-and-Drop-Technik für die Reihenfolge der Reihenfolge .Ich auch neue Reihenfolge zu DB (Mysql) durch Aufruf Aktion durch AJAX.und Anzeige der Reihenfolge Durch die Verwendung der Reihenfolge nach SQL-Abfrage. Aber zum zweiten Mal funktioniert es nicht gut, weil ich nicht in der Lage bin, neue Zeilenreihenfolge für TR ID zu bekommen. Bitte teilen Sie Ihre Sicht auf das. Ich mache Drag and Drop durch Javascript-Code, der so ist:

this.onDrop = function(table, droppedRow) { 
    var rows = this.table.tBodies[0].rows; 
    var debugStr = ""; 
    for (var i=0; i<rows.length; i++) { 
     debugStr += rows[i].id+" "; 
     alert(debugStr); 
     alert(droppedRow.id); 
    } 
    // document.getElementById('debug').innerHTML = debugStr; 
    function ajaxRequest(){ 
     var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"] //activeX versions to check for in IE 
     if (window.ActiveXObject){ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken) 
      for (var i=0; i<activexmodes.length; i++){ 
       try{ 
        return new ActiveXObject(activexmodes[i]) 
       } 
       catch(e){ 
       //suppress error 
       } 
      } 
     } 
     else if (window.XMLHttpRequest) // if Mozilla, Safari etc 
      return new XMLHttpRequest() 
     else 
      return false 
    } 

    //Sample call: 
    var mypostrequest=new ajaxRequest() 
    mypostrequest.onreadystatechange=function(){ 
     if (mypostrequest.readyState==4){ 
      if (mypostrequest.status==200 || window.location.href.indexOf("http")==-1){ 
       document.getElementById("gfdg").innerHTML=mypostrequest.responseText 
      } 
      else{ 
       alert("An error has occured making the request") 
      } 
     } 
    } 
    //var namevalue=encodeURIComponent(document.getElementById("name").value) 
    // var agevalue=encodeURIComponent(document.getElementById("age").value) 
    var parameters="array="+debugStr+"&maxLimit="+droppedRow.id 
    mypostrequest.open("POST", "tableAjaxUpdate.action", true) 
    mypostrequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded") 
    mypostrequest.send(parameters) 
} 

und meine HTML-Tabelle Code ist so.

<tr id="<%= uniqueId%>">/I am taking this row id from the db(from the exorder column) 
    <% System.out.println("AAAuniqueId----->" + uniqueId); %> 
    <td height="30" align="center" valign="middle" class="vtd" width="3%"> 
    <%=dayCount%> 
    </td> 
    <td height="30" align="center" valign="middle" class="vtd" width="3%"> 
    <%=exerciseGroupName%> 
    </td> 

    <td height="30" align="center" valign="middle" class="vtd" width="3%"> 
    <%=exerciseName%> 
    </td> 
    <td height="30" align="center" valign="middle" class="vtd" width="3%"> 
    <%=sets%> 

    </td> 
    <td height="30" align="center" valign="middle" class="vtd" width="3%"> 
    <%=reps%> 
    </td> 
    <td height="30" align="center" valign="middle" class="vtd" width="3%"> 
    <s:url id="idDeleteExName" action="deleteExNameInCustomtemplate"> 
     <s:param name="dayCount"> <%=dayCount%></s:param> 
     <s:param name="cusExId"><%=cusExId%></s:param> 
     <s:param name="routineId"><%=routineId%></s:param> 
    </s:url> 
    <s:a href="%{idDeleteExName}"><img src="images/tables/delete-icon.png" style="width: 35px;height: 35px;"></s:a> 
    </td> 

Answer 1

Soweit ich unter Ihrer Frage Sie nicht gewünschte Ausgabe nach dem Ajax-Aufruf zu bekommen. Ich gebe Ihnen einige Links, die wir Ihnen durch vollständiges Konzept Verständnis und Lösung für Ihr Problem, d. H. Die Umsetzung von Ajax Aufruf auf JSP.

Konzept Flussdiagramm AJAX: wie Ajax-Werke auf der Webseite http://www.w3schools.com/ajax/ajax_intro.asp

Wenn Sie bereits über diesem ... Implementierung auf AJAX auf jsp wissen .. hier eine der vielen möglichen Lösungen ... http://newtechies.blogspot.in/2007/12/simple-example-using-ajax-jsp.html

Unten ist Thread von Stackoverflow nur darüber. ajax and jsp integration Link oben gibt Ihnen andere mögliche Lösungen auch ..

Genießen Codierung ... :)

Answer 2

Sie können Ihre gleichen Ort aktualisieren

location.reload(true) verwenden.

Answer 3

Nun, bei Erfolg des AJAX-Aufrufs müssen Sie die Seite aktualisieren. so in Ihrem AJAX-Aufruf schreibe ich als:

var mypostrequest=new ajaxRequest(); 
mypostrequest.onreadystatechange=function(){ 
    if (mypostrequest.readyState==4){ 
     if (mypostrequest.status==200 || window.location.href.indexOf("http")==-1){ 
      document.getElementById("gfdg").innerHTML=mypostrequest.responseText; 
      //this is the success point of your AJAX call and you need to refresh here 
      window.location.reload(); //this is the code for reloading 
      //but your "gfdg" div data will be lost if you refresh, 
      // so start another AJAX call here 
     } 
     else{ 
      alert("An error has occured making the request"); 
     } 
    } 
} 

Aber ich habe Angst, dass Ihre gfdg div, die einige neue Daten hat nach dem erneuten Laden der Seite verloren. Du könntest einen anderen AJAX-Anruf anstatt auffrischen.

Noch ein Punkt, verwenden Sie den klassischen AJAX, verwenden Sie stattdessen eine erweiterte Bibliothek wie jQuery AJAX. Es wird Ihren Code vereinfachen und bietet viel Flexibilität und Browser-Kompatibilität.