struts2 页面局部刷新问题。
一个struts2的项目中有一个复杂的画面。
该画面上有一堆输入框以及2个table。
每个table上都有相应的更新,删除,插入按钮。
点击删除,直接在table上删除选中的数据。
点击更新和插入都会弹出一个子画面,在子画面上填入要更新或插入的数据内容。
点击子画面的确定,子画面关闭回到大画面时仅table的数据有相应的更新。
问题:
在删除和插入的时候,从子画面回到大画面的时候,不想刷新整个大画面,因为输入框太多,其中还有若干选择框,每次刷新都要取一边,太费时间,所以想只刷新大画面中的table那部分。要如何处理?
大家给点建议吧。
如果用javascript,要注意哪些地方,请有类似经验的朋友不吝赐教。最好给出基本步骤。
谢谢!谢谢!
[解决办法]
用ajax啊
[解决办法]
jquery或dojo都是很好的js框架,opensource
[解决办法]
关键是你点击确定时,仅仅更新了子画面的信息这个不好做,似乎得用上AJAX,
我一般是点击确定全部提交过去update,在添加,删除,修改这样的操作的时候用的JS来做的
或者可以这样,页面中用一个标识符,来标示被改变的table,默认为0(无更改),当有此table上有js的操作时,变更状态为1(已修改),在后台获取进行数据库操作。但是这样做不到局部刷新的,必须用AJAX了,好像
[解决办法]
你可以这样做啊,子画面用div显示,div 的显示隐藏,更新后用javascript的DOM来删除,更新标签的元素啊,至于后台的操作用ajax,且只有后台成功前台才正确显示
[解决办法]
所以想只刷新大画面中的table那部分。
这到底是哪部分?是说数据局域?还是...删除或插入的那行?
如果你做的并不是很安全的话,,那么 用JS这样做
删除的时候,数据局域需要删除那行把它隐藏掉,或者innerHTML="",
插入的时候,也可以用innerHTML+="xxxx";
如果你是想刷新整个数据区域,,那么..你用AJAX 请求的时候,返回给你一个 一样的数据区域的html就OK..然后把整个数据区域div的innerHTML=返回的东西.
innerHTML是个好东西,用着方便,,不过 效率低,可以说极低吧....有种稍微复杂点的 就是 new一个标签,设置属性 然后加入到div或者父标签里面去..
[解决办法]
标记,听上去有点难度。。。。。。。。
想想,希望有高人
[解决办法]
用jquery的ajax是很简单的,而且jquery对页面的操作也很方便。
js:
$("mytable > tr").remove();
$.ajax({url:"some url",success:function(){ // process }});
...
[解决办法]
帮顶.求得5分
[解决办法]
推荐使用一些表格控件,比如:jQgrid.
[解决办法]
不想用 jquery 就用 frameset 可以了..
[解决办法]
$("#mytable > tr").remove();
意思是删除id=mytable的表格的所有行
$.ajax方法中,success是当ajax成功时调用的函数,error是ajax失败时调用的函数
你可以在成功是操作表格:
$("#mytable").append($("<tr></tr>"));
$("<tr></tr>")是构造一个行,用append插入到表格中
具体用法请上http://jquery.com
[解决办法]
以我的观点,千万不要用原生的html dom去操作,除非有必要。
否则很容易出现浏览器兼容性问题
[解决办法]
强烈推荐 jQuery.ajax
[解决办法]
直接从后台返回html代码
[解决办法]
用ajax、jquery、dwr、javascript等等,都可以解决啊
[解决办法]
});
ajaxManager.add( {
type :"POST",
url :"ajax/cancelAdd.action?vmName=" + name + "&currCpus="
+ currCpus + "&seleDevice=" + seleDevice
+ "&currMem=" + currMem + "&vmId=" + vmId+"&vncPWDStr="+vncPasswork,
success : function(text) {
$("#showUpdateVMInfo").html(text);
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
$("#showUpdateVMInfo")
.html(
"<strong>An error occured, and your request could not be completed...Please try again.</strong>");
},
abort : function(i) {
}
});
$("#showUpdateVMInfo").html(text);这一句就是你定义TABLE外面的层的ID叫showUpdateVMInfo,这个text就是你返回过来的一个页面
祝LZ成功,想用有什么不懂可以问我哈!