ajax操作后如何刷新jsp页面
Posted
技术标签:
【中文标题】ajax操作后如何刷新jsp页面【英文标题】:how to refresh the jsp page after ajax action 【发布时间】:2012-04-12 19:54:43 【问题描述】:我的问题是我在 jsp 页面中有一个 html 表。我应用拖放技术进行行排序。我还通过 AJAX 调用操作将新订单保存到 DB(mysql)。并使用订单显示订单通过 sql 查询。但是第二次它不能正常工作,因为我无法获得 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 align="center" valign="middle" class="vtd" >
<%=dayCount%>
</td>
<td align="center" valign="middle" class="vtd" >
<%=exerciseGroupName%>
</td>
<td align="center" valign="middle" class="vtd" >
<%=exerciseName%>
</td>
<td align="center" valign="middle" class="vtd" >
<%=sets%>
</td>
<td align="center" valign="middle" class="vtd" >
<%=reps%>
</td>
<td align="center" valign="middle" class="vtd" >
<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 用于在不刷新页面的情况下获取一些服务器端数据。如果要刷新页面,为什么要使用 AJAX ?请提交<form>
。如果您的要求是在 AJAX 调用完成后刷新页面,那么 Javascript 中也有解决方法。但是如果没有看到你在做什么,就很难给出一些建议。如果仍有问题,请发布您的代码。
先生,当我将一行拖放到另一个位置时,这个 javascript 函数 this.onDrop = function(table, droppedRow) 正在调用,所以为了更新到服务器新的行顺序,我必须调用AJAX.YOu 可以在我的帖子中看到代码。执行操作后,我再次返回相同的 jsp,但这次我没有在 UI 中再次获得行 ID。请先生分享您的看法,我在这方面挣扎了很多天。
【参考方案1】:
就您的问题而言,您在 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
下面是***的线程,仅在此之上。 ajax and jsp integration 上面的链接还为您提供了其他可能的解决方案..
享受编码... :)
【讨论】:
【参考方案2】:好吧,在 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。它将简化您的代码,并具有很大的灵活性和浏览器兼容性。
【讨论】:
先生,情况就像我将上面的html代码放在单独的jsp(call.jsp)中并将这个jsp(call.jsp)包含到另一个jsp中。现在我正在拖放表格行并更新服务器。并在 gfdg div 中返回 call.jsp 但我的 gfdg div 不刷新为什么? AJAX 调用真的返回一些值吗?如果您执行alert(mypostrequest.responseText);
会发生什么【参考方案3】:
您可以使用刷新相同的位置
location.reload(true)
.
【讨论】:
我必须在我的 cade 中添加此代码以再次刷新页面。先生,我在上面发布了我的代码,请注意它。 我不知道你到底想在哪里刷新 jsp 页面。无论如何,你可以做一件事,像这样编写java脚本函数 并在您想重新安排的地方拨打电话...如果您有更多疑问,请在此处发布。 我想在服务器响应时再次加载上面的 html 代码。 ok 然后放在这里...if (mypostrequest.status==200 || window.location.href.indexOf("http")==-1) document.getElementById("gfdg" ).innerHTML=mypostrequest.responseText; location.reload(true);以上是关于ajax操作后如何刷新jsp页面的主要内容,如果未能解决你的问题,请参考以下文章