日期:2014-05-16  浏览次数:20325 次

extjs+struts(JSON)对表格的增删查改

html代码:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>
<link rel="stylesheet" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript" src="ext/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="js/edit.js"></script>
</head>
<body>

</body>
</html>

?edit.js代码:

	function editRecord() {
	}
	
	function deleteRecord() {
		var grid = Ext.getCmp("table");
		var sm = grid.getSelectionModel();
		var sel = sm.getSelections();
		if(sm.hasSelection()){
			Ext.MessageBox.show({
				title:"删除用户记录",
				buttons:Ext.MessageBox.YESNOCANCEL,
				msg:"您确定要删除"+sel.length+"个用户吗?",
				fn:function(btn){
					if(btn=="yes"){
			
						var ids = "[";
						for(var i=0;i<sel.length;i++){
							var record = sel[i];
							ids+=record.get("id")+",";
						}
						ids = ids.substring(0,ids.length-1)+"]";
						alert(ids);
						var conn = new Ext.data.Connection();
						conn.request({
							url:"http://localhost:8686/myjob1/delete",
							params:{
								action:"delete",
								ids:ids
							},
							success:function(resp,opt){
								for(var i=0;i<sel.length;i++){
									var record = sel[i];
									grid.getStore().remove(record);
								}
							},
							failure:function(resp,opt){
								Ext.MessageBox.alert("错误","不能删除用户信息!");
							}
						});
					}
				}
			});
		}
		//grid.getStore().reload(null);
	}
	
	function addRecord() {
		var ds_model = Ext.data.Record.create([
			"id",
			"name",
			"password",
			"sex",
			"age"
		]);
		var grid = Ext.getCmp("table");
		var page = grid.getBottomToolbar();
		//pageCount = getRowSize()/getPageSize() + ((getRowSize()%getPageSize())==0?0:1);
		var store = grid.getStore();
		var row = store.getTotalCount();
		var pageSize = store.getCount();
		var pageCount = Math.ceil(row/pageSize);
		alert(row+"--"+pageSize+"--"+pageCount);
		page.changePage(pageCount);
		var conn = new Ext.data.Connection();
		conn.request({
			url:"http://localhost:8686/myjob1/add",
			method:"post",
			params:{
				name:"NewUser"
			},
			success:function(resp,opt){
				var insert_id = Ext.util.JSON.decode(resp.responseText).id;
				grid.getStore().insert(0,new ds_model({
					id:insert_id,
					name:"NewUser",
					password:"",
					sex:"true",
					age:0
				}));
				grid.startEditing(0,0);
			},
			failure:function(resp,opt){
				alert(resp+">>>>>>>>"+opt);
				Ext.MessageBox.alert("","不能插入新用户!");
			}
		});
		//grid.getStore().reload(null);
	}
	
	function rendererSex(val) {
		if (val == true) 
			return "<h4 style='color:green'>男</h4>";
		else 
			return "<h4 style='color:red'>女</h4>";
			
	}
	function selectAll(){
		var sm = Ext.getCmp("table").getSelectionModel();
		sm.selectAll();
	}
	function disSelect(){
		//Ext.MessageBox.alert("","你点击了编辑");
		var grid = Ext.getCmp("table");
		var sm = Ext.getCmp("table").getSelectionModel();
		for(var i=grid.getView().getRows().length-1;i>=0;i--){
	       if(sm.isSelected(i)){
	    	   sm.deselectRow(i);
	       }else{
	    	   sm.selectRows([i],true);   // rsm.selectRow(i,true); 也可以
	       }
		}
	}
	function saveRecord(){
		alert("save");
		var grid = Ext.getCmp("table");
		
	}
Ext.onReady(function(){
	var idEditor = new Ext.form.TextField();
	var nameEditor = new Ext.form.TextField();
	var passwordEditor = new Ext.form.TextField();
	var sexEditor = new Ext.f