页面无刷新并自动去获取数据库中的数据
要求：
一个list页面，如果有新增的数据，这个页面要无刷新的及时显示，并且如果我以拖动鼠标的方式选中了多条数
据（拖动鼠标的方式copy数据），及时显示的同时不能让我选中的这些数据的阴影消失，急，，，急。。。。
请各位帮帮忙啦，小妹不甚感激！！！！！！！
[解决办法]
1.定时采用ajax方式获得数据
2.每次用ajax请求的时候，只返回增量数据，那么就要传送一个上次请求的时间或最大的id过去
3.若想选中的数据还保持，则不能用分页的方式显示列表
[解决办法]
list页面刷新可以用DWR技术实现，鼠标选中则不了解帮不了
[解决办法]
[解决办法]
Ext.onReady(init);
function init(){
var viewport=new Ext.Viewport({
layout:'border',
items:[gridPanel]
});
//定时器
new Ext.util.TaskRunner().start({
run:function(){
queryStore.load();
},interval:3000
});
queryStore.load({
//callback:function(records,option,success) {
//alert('aaa'+records.length);
//}
});
};
var addButton=new Ext.Button({
id:'addButton',
text:'增加',
handler:function(){
formPanel.getForm().reset();
win.setTitle("增加用户");
win.show();
}
});
var deleteButton=new Ext.Button({
text:'删除',
handler:function(){
Ext.Msg.confirm('提示','确定要删除？',function(button){
if(button=='yes'){
var record=gridPanel.getSelectionModel().getSelected();
if(record==null){
Ext.Msg.alert('提示','请选择某一确定的记录！');
return;
}
var id=record.get('id');
Ext.Ajax.request({
url:'./delete.do',
params:{
id:id
},
success:function(response){
//var obj=Ext.decode(response.responseText);
//if(obj.success){
//queryStore.remove(record);
queryStore.load();
//}else{
//Ext.Msg.alert('提示',obj.msg);
//}
},
failure:function(){
Ext.Msg.alert('提示','删除失败');
}
})
}
})
}
});
var modifyButton=new Ext.Button({
text:'修改',
handler:function(){
var selModel=gridPanel.getSelectionModel();
if(selModel.hasSelection()){
var record=selModel.getSelected();
functionModify(record);
}
}
});
var functionModify=function(record){
win.setTitle('修改用户');
win.show(modifyButton,function(){
formPanel.getForm().load({
url:'./queryOne.do?id='+record.get('id'),
success:function(){
},
faulire:function(){
Ext.Msg.alert('提示','加载失败');
}
})
});
}
var reader=new Ext.data.JsonReader({
idProperty:'id',
//root:'list',
fields:[
{name:'id',mapping:'id',type:'string'},
{name:'name',mapping:'name',type:'string'},
{name:'password',mapping:'password',type:'string'}
]
})
var queryStore=new Ext.data.Store({
id:'queryStore',
autoDestory:true,
url:'./query.do',
reader:reader
//paramNames:{
//sort:'id'
//}
});
var gridPanel=new Ext.grid.GridPanel({
id:'gridPanel',
region:'center',
title:'用户',
frame: false,
border:false,
view:new Ext.ux.grid.LockingGridView(),
tbar:[addButton,deleteButton,modifyButton],
store:queryStore,
cm:new Ext.ux.grid.LockingColumnModel({
defaults:{
sortable:false,
locked:false
},
columns:[
new Ext.grid.Column({
dataIndex:'id',
header:'编号'
}),
new Ext.grid.Column({
dataIndex:'name',
header:'姓名'
}),
new Ext.grid.Column({
dataIndex:'password',
header:'密码'
})
]
}),
listeners:{
rowdblclick:function(grid,rowIndex,e){
functionModify(queryStore.getAt(rowIndex));
}
}
});
var idTextField=new Ext.form.TextField({
fieldLabel:'编号',
name:'id'
})
var nameTextField=new Ext.form.TextField({
fieldLabel:'姓名',
name:'name'
})
var passwordTextField=new Ext.form.TextField({
id:'password',
fieldLabel:'密码',
name:'password'
})
var formPanel=new Ext.form.FormPanel({
id:'formPanel',
labelWidth:40,
width:300,
height:300,
region:'center',
bodyStyle:'padding:15px',
xtype:'form',
items:[idTextField,nameTextField,passwordTextField,new Ext.form.RadioGroup({
items:[{boxLabel:'电压等级',name:'option',checked:true},{boxLabel:'电压等级',name:'option'},{boxLabel:'电压等级',name:'option'}]
})],
reader:reader
});
var submit=new Ext.Button({
id:'submit',
text:'确定',
handler:function(){
if(idTextField.getValue().length==0){
Ext.Msg.alert('提示','编号不能为空',function(){idTextField.focus();});
return;
};
if(nameTextField.getValue().length==0){
Ext.Msg.alert('提示','姓名不能为空',function(){nameTextField.focus();});
return;
};
if(passwordTextField.getValue().length==0){
Ext.Msg.alert('提示','密码不能为空',function(){passwordTextField.focus();});
return;
};
try{
formPanel.getForm().doAction('submit',{
url:'./add.do',
method:'POST',
//waitMsg:'正在保存...',
//timeout:3000,
success:function(form,action){
queryStore.load();
win.hide();
},
failure:function(form,action){
Ext.Msg.alert('提示','保存失败');
}
});
}catch(e){
alert(e.message);
}
}
});
var cancel=new Ext.Button({
text:'取消',
handler:function(){
win.hide();
}
});
var win = new Ext.Window({
id:'win',
width:400,
height:200,
layout:'fit',
modal:true,
closeAction:'hide',
plain:true,
items:formPanel,
buttons:[submit,cancel]
});
这是我的js，你先看看吧
[解决办法]
如果不是整个页面reload 动态insert方式应该不会把鼠标拖动选中数据的阴影去除
