STRUTS1.2+AJAX
系统
1896 0
在一个页面上有两个DIV，DIV1和DIV2，在DIV1中有一棵树，在DIV2中有一个struts form，在struts form中有一个文本框和一个提交按钮，我想实现如下功能：在文本框中写上信息，然后按提交按钮，提交按钮会调用struts的action，将文本框中的数据写入数据库中，然后DIV2中的struts form刷新为初始状态，我想知道如何实现页面DIV2的刷新而DIV1页面保持不变？有代码可以参考吗？
-----div 1------------ ------div 2------------------------
| tree | | ------struts form--------------|
| | | | text area |
| | | | button |
| | | --------------------------------|
------------------------- -----------------------------------
|
|
|
|
|
|
问题点数：
100
回复次数：
6
显示所有回复显示星级回复显示楼主回复
修改
删除
举报
引用
回复
|
加为好友
发送私信
在线聊天
-
shenglijay
-
-
等级:
-
可用分等级：中农
-
总技术专家分：1253
-
总技术专家分排名：16177
|
|
发表于：
2007-02-08 08:50:00
2
楼 得分:
0
|
|
点击button，通过触发onclick事件。写点ajax代码应该可以实现的。通过你的js代码来提交给action.在通过响应信息来刷新你的form
|
|
|
|
<!---->
修改
删除
举报
引用
回复
|
|
加为好友
发送私信
在线聊天
-
zhangsc
-
-
等级:
-
可用分等级：富农
-
总技术专家分：56
-
总技术专家分排名：118779
|
|
发表于：
2007-02-08 11:49:55
3
楼 得分:
0
|
|
有一点我没有明白，在通过js来调用struts action,action结束后会调用forward，会使整个页面刷新，我想知道如何实现局部刷新，能给出具体的代码吗？
|
|
|
|
<!---->
修改
删除
举报
引用
回复
|
|
加为好友
发送私信
在线聊天
-
shenglijay
-
-
等级:
-
可用分等级：中农
-
总技术专家分：1253
-
总技术专家分排名：16177
|
|
发表于：
2007-02-08 13:08:37
4
楼 得分:
0
|
|
你调struts action 时侯，action 里面 最后要返回一个forward对象时， 你写成 return null; 这样它就会返回到你的页面。实现的效果就是局部刷新
|
|
|
|
<!---->
修改
删除
举报
引用
回复
|
|
加为好友
发送私信
在线聊天
-
zhangsc
-
-
等级:
-
可用分等级：富农
-
总技术专家分：56
-
总技术专家分排名：118779
|
|
发表于：
2007-02-08 13:28:50
5
楼 得分:
0
|
|
是可以这样做，但是却没有使用上Ajax技术，Ajax技术的优势一点都没有体现出来
|
|
|
|
<!---->
修改
删除
举报
引用
回复
|
|
加为好友
发送私信
在线聊天
-
shenglijay
-
-
等级:
-
可用分等级：中农
-
总技术专家分：1253
-
总技术专家分排名：16177
|
|
发表于：
2007-02-08 17:18:29
6
楼 得分:
100
|
页面：
------------------------------------------------------------
<html>
<head>
<script type= "text/javascript ">
var http = getHttpObject();
/* 确保在ie的各式版本，以及在firefox或其他浏览器下，都有用的xmlhttpRequest */
function getHttpObject(){
var xmlhttp = false;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
if(xmlhttp.overrideMimeType){
xmlhttp.overrideMimeType( 'text/xml ');
}
}
else{
try{
xmlhttp = new ActiveXObject( "Msxml2.XMLHTTP ");
}catch(e){
try{
xmlhttp = new ActiveXObject( "Microsoft.XMLHTTP ");
}catch(e){
xmlhttp = false;
}
}
}
return xmlhttp;
}
function handleHttpResponse(){
if(http.readyState == 4){
if(http.status == 200){
var text = http.responseText;
if(text != null || text.length > 0)
// update the textarea;
document.getElementById( "input ").value = text;
}
else{
alert( "error!!! ");
alert(http.status);
}
}
}
function getInfo(){
var url = "aaa.do "; // your action name
http.open( "GET ",url,true);
http.onreadystatechange = handleHttpResponse;
http.send(null);
return ;
}
</script>
</head>
<body>
<div id= "tree " style= "width:150px;height:500px;float:left;background-color:limegreen; "> this is a menu tree </div>
<div id= "form " style= "width:820px;height:500px;float:left;background-color:yellow; ">
textArea: <input type= "text " id= "input "> <br>
<input type= "button " onclick= "getInfo(); " value= "Submit ">
</div>
</body>
</html>
-------------------------------------------
Action
--------------------------------------------
public class GetMsgAction extends Action {
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
response.setContentType( "text/html ");
response.setCharacterEncoding( "utf-8 ");
try {
response.getWriter().write( "hello,this is the update text!! ");
} catch (IOException e) {
e.printStackTrace();
}
// should be return null;
return null;
}
}
-------------------------------------
大致就是这样啊，至于你要更新什么，还是从数据库取什么在更新就自己做吧，我只是做个简单的例子
|
|
STRUTS1.2+AJAX
更多文章、技术交流、商务合作、联系博主
微信扫码或搜索：z360901061
微信扫一扫加我为好友
QQ号联系： 360901061
您的支持是博主写作最大的动力，如果您喜欢我的文章，感觉我的文章对您有帮助，请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧，狠狠点击下面给点支持吧，站长非常感激您！手机微信长按不能支付解决办法：请将微信支付二维码保存到相册，切换到微信，然后点击微信右上角扫一扫功能，选择支付二维码完成支付。
【本文对您有帮助就好】元
