[英]how to refresh the jsp page after ajax action
我的問題是我在jsp頁面中有一個html表。並且我將拖放技術應用於行排序。我還通過通過AJAX調用action並通過使用sql查詢來顯示訂單來將新訂單保存到DB(Mysql) 。但是第二次它不能正常工作,因為我無法獲得TR id的新行順序。請先生分享您的看法。我正在通過如下代碼拖放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>
據我所問,您的ajax調用后沒有得到期望的輸出。 我為您提供了一些鏈接,這些鏈接可以幫助您全面理解概念並解決您的問題,即在jsp上實現ajax調用。
AJAX的概念流程圖:ajax如何在網頁http://www.w3schools.com/ajax/ajax_intro.asp上工作
如果您已經知道上述內容,那么...在jsp上的AJAX上實現..這里是許多可能的解決方案之一... http://newtechies.blogspot.in/2007/12/simple-example-using-ajax-jsp。 html
下面是僅在此之上的stackoverflow線程。 ajax和jsp集成上面的鏈接還為您提供了其他可能的解決方案。
享受編碼... :)
您可以使用刷新您的相同位置
location.reload(true)
。
好吧,要成功進行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
div(其中包含一些新數據)在重新加載頁面后會丟失。 您可以調用另一個AJAX而不是刷新。
還有一點,您正在使用經典的AJAX,而是使用更高級的庫,例如jQuery AJAX 。 它將簡化您的代碼,並具有很大的靈活性和瀏覽器兼容性。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.