1,页面部分的Ext.onReady(function(){ //定义数据集对象 var bookStore = new Ext.data.Store({ autoLoad :true, reader: new Ext.data.XmlReader({ totalRecords: "results", record: "Book", id: "id" }, Ext.data.Record.create([ {name: 'id'}, {name: 'bookName'}, {name: 'author'}, {name: 'typeName'}, {name: 'price'}, {name: 'brief'} ]) ), proxy : new Ext.data.HttpProxy({ url : 'bookext.do?method=getBookList' }) }) //创建工具栏组件 var toolbar = new Ext.Toolbar([ {text : '修改书籍',iconCls:'option',handler:showModifyBook} ]); //创建Grid表格组件 var cb = new Ext.grid.CheckboxSelectionModel() var bookGrid = new Ext.grid.GridPanel({ applyTo : 'grid-div', frame:true, tbar : toolbar, store: bookStore, stripeRows : true, autoScroll : true, viewConfig : { autoFill : true }, sm : cb, columns: [//配置表格列 new Ext.grid.RowNumberer({ header : '行号', width : 40 }),//表格行号组件 cb, {header: "书籍编号", width: 80, dataIndex: 'id', sortable: true}, {header: "书籍名称", width: 80, dataIndex: 'bookName', sortable: true}, {header: "作者", width: 80, dataIndex: 'author', sortable: true}, {header: "类型", width: 80, dataIndex: 'typeName', sortable: true}, {header: "金额", width: 80, dataIndex: 'price', sortable: true}, {header: "简介", width: 80, dataIndex: 'brief', sortable: true} ] }) //创建新增书籍信息的form表单 Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side';//统一指定错误信息提示方式 var bookForm = new Ext.FormPanel({ labelSeparator : ":", frame:true, border:false, items : [ { xtype:'textfield', width : 200, allowBlank : false, blankText : '书籍名称不能为空', name : 'bookName', fieldLabel:'书籍名称' },{ xtype:'textfield', width : 200, allowBlank : false, blankText : '书籍作者不能为空', name : 'author', fieldLabel:'作者' },{ xtype:'combo', width : 200, allowBlank : false, blankText : '必须选择书籍类型', hiddenName : 'bookTypeId', name : 'typeName', store : new Ext.data.Store({ autoLoad :true, reader: new Ext.data.XmlReader({ totalRecords: "results", record: "BookType", id: "id" }, Ext.data.Record.create([ {name: 'id'}, {name: 'title'}, {name: 'detail'} ]) ), proxy : new Ext.data.HttpProxy({ url : 'bookext.do?method=getBookTypeList' }) }),//设置数据源 allQuery:'allbook',//查询全部信息的查询字符串 triggerAction: 'all',//单击触发按钮显示全部数据 editable : false,//禁止编辑 loadingText : '正在加载书籍类型信息',//加载数据时显示的提示信息 displayField:'title',//定义要显示的字段 valueField : 'id', emptyText :'请选择书籍类型', mode: 'remote',//远程模式 fieldLabel:'类型' },{ xtype:'textfield', width : 200, name : 'price', fieldLabel:'金额' },{ xtype:'textarea', width : 200, name : 'brief', fieldLabel:'简介' },{ xtype:'hidden', name : 'id' } ], buttons:[ { text : '关闭', handler : function(){ win.hide(); } },{ text : '提交', handler : submitForm } ] }); //创建弹出窗口 var win = new Ext.Window({ layout:'fit', width:380, closeAction:'hide', height:280, resizable : false, shadow : true, modal :true, closable:true, bodyStyle:'padding:5 5 5 5', animCollapse:true, items:[bookForm] }); //显示新建书籍窗口 function showAddBook(){ bookForm.form.reset(); bookForm.isAdd = true; win.setTitle("新增书籍信息"); win.show(); } //加载表单数据 function loadForm(bookId){ bookForm.form.load({ waitMsg : '正在加载数据请稍后',//提示信息 waitTitle : '提示',//标题 url : 'bookext.do?method=getBookById',//请求的url地址 params : {bookId:bookId}, method:'GET',//请求方式 success:function(form,action){//加载成功的处理函数 //Ext.Msg.alert('提示','数据加载成功'); }, failure:function(form,action){//加载失败的处理函数 Ext.Msg.alert('提示','数据加载失败'); } }); } //提交表单数据 function submitForm(){ //判断当前执行的提交操作,isAdd为true表示执行书籍新增操作,false表示执行书籍修改操作 if(bookForm.isAdd){ //新增书籍信息 bookForm.form.submit({ clientValidation:true,//进行客户端验证 waitMsg : '正在提交数据请稍后',//提示信息 waitTitle : '提示',//标题 url : 'bookext.do?method=addBook',//请求的url地址 method:'POST',//请求方式 success:function(form,action){//加载成功的处理函数 win.hide(); updateBookList(action.result.bookId); Ext.Msg.alert('提示','新增书籍成功'); }, failure:function(form,action){//加载失败的处理函数 Ext.Msg.alert('提示','新增书籍失败'); } }); } } //明细数据修改后,同步更新书籍列表信息 function updateBookList(bookId){ var fields = getFormFieldsObj(bookId); var index = bookStore.find('id',fields.id); if(index != -1){ var item = bookStore.getAt(index); for(var fieldName in fields){ item.set(fieldName,fields[fieldName]); } bookStore.commitChanges(); }else{ var rec = new Ext.data.Record(fields); bookStore.add(rec); } }=====================================================================2,后台部分的Action/* * 添加书籍 */ public ActionForward addBookType(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception { String title = request.getParameter("title"); String detail = request.getParameter("detail"); BookType bookType = new BookType(); bookType.setTitle(new String(title.getBytes("ISO8859-1"),"UTF-8")); bookType.setDetail(new String(detail.getBytes("ISO8859-1"),"UTF-8")); int bookTypeId = service.addBookType(bookType); boolean isSuccess = true; if(bookTypeId == -1){ isSuccess = false; } response.setContentType("text/json;charset=UTF-8"); response.getWriter().write("{success:"+isSuccess+",bookTypeId:"+bookTypeId+"}"); return null; }。。。。。。。。。