Как обновить страницу jsp после действия ajax

Question

Моя проблема заключается в том, что у меня есть одна таблица html на странице jsp. И я применил технологию перетаскивания для упорядочения строк. Я также сохраняю новый порядок в DB (Mysql). Вызывая действие через AJAX.и показывая заказ. Используя заказ по sql-запросу. Но во второй раз он не работает хорошо, потому что я не могу получить новый порядок строк для идентификатора TR. Пожалуйста, сэр поделитесь своим взглядом на это. Я занимаюсь перетаскиванием через код Javascript, который выглядит следующим образом:

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) 
} 

и мой код таблицы Html - вот так.

<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

Насколько я под вопрос ваш не получают желаемый результат после вашего вызова AJAX. Я даю вам некоторые ссылки, которые мы вам даем через полное понимание концепции и решение вашей проблемы, то есть реализацию ajax-вызова на jsp.

схема Концепция потока AJAX: как Ajax работает на веб-странице http://www.w3schools.com/ajax/ajax_intro.asp

Если вы уже знаете, что выше ... реализация на AJAX на JSP .. здесь один из многих возможных решений ... http://newtechies.blogspot.in/2007/12/simple-example-using-ajax-jsp.html

Ниже приведен поток потоков stackoverflow только над этим. ajax and jsp integration Выше ссылка дает вам другие возможные решения также ..

Наслаждайтесь кодированием ... :)

Answer 2

Вы можете обновить же местоположение с помощью

location.reload(true).

Answer 3

Ну, в случае успеха вызова AJAX вам необходимо обновить страницу. так внутри вызова AJAX я пишу как:

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"); 
     } 
    } 
} 

Но я боюсь, что ваши gfdg ДИВ, которые имеют какие-то новые данные будут утеряны после перезагрузки страницы. Вы можете использовать другой вызов AJAX вместо обновления.

Еще один момент, вы используете классический AJAX, вместо этого используйте более совершенную библиотеку, такую ​​как jQuery AJAX. Это упростит ваш код и обеспечит большую гибкость и совместимость с браузером.