ext+dwr完整的例子(包括樹,增删改查等)

---js

var UI = function(){

var ds;

var grid;

return {

init : function() {

Ext.QuickTips.init();

initDataSource();

ds.load({params:{start:0, limit:15}});

buildUI();

getStore: function() {

return ds;

}

};

function initDataSource(){

var recordType = Ext.data.Record.create([

{name:"id",type:"string"},

{name:"wf_id",type:"string"},

{name:"dept_name",type:"string"},

{name:"fax",type:"string"},

{name:"send_time",type:"date"}

]);

var proxy = new Ext.data.DWRProxy(AddHideColumn.getList, true);

ds = new Ext.data.Store({

proxy: proxy,

reader: new Ext.data.ListRangeReader(

{id:'id', totalProperty:'totalSize'}, recordType),

remoteSort: true

});

}

function getColumnModel(){

var columnModel = new Ext.grid.ColumnModel([{

header: 'ID',

width: 40,

align: 'center',

sortable: true,

dataIndex: 'id'

{

header: '流程ID',

width: 150,

align: 'left',

sortable: true,

dataIndex: 'wf_id'

{

header: '機關',

width: 150,

align: 'left',

sortable: true,

dataIndex: 'dept_name'

{

header: '傳真',

width: 150,

align: 'left',

sortable: true,

dataIndex: 'fax'

{

header: '發送時間',

width: 150,

align: 'left',

sortable: true,

dataIndex: 'send_time',

renderer: Ext.util.Format.dateRenderer('Y-n-j G:i')

}

]);

columnModel.defaultSortable = true;

return columnModel;

}

function buildUI(){

var tb = new Ext.Toolbar( [{

text: '建立',

cls: 'x-btn-text-icon',

icon: '../images/iconNewNewsEntry.gif',

handler: function(){

showCreateUserDialog();

}

},{

text: '編輯',

cls: 'x-btn-text-icon',

icon: '../images/ed.gif',

handler : function(){

doEdit();

}

},{

text: '删除',

cls: 'x-btn-text-icon',

icon: '../images/removesmall.gif',

handler : function(){

doDel();

}

{

text: '機構樹',

cls: 'x-btn-text-icon',

icon: '../images/search.gif',

handler : function(){

showTree();

}

]);

var bbar = new Ext.PagingToolbar({

pageSize: 15,

store: ds,

displayInfo: true,

displayMsg: '顯示第 {0} 條到 {1} 條記錄，一共 {2} 條',

emptyMsg: "沒有記錄"

})

grid = new Ext.grid.GridPanel({

store: ds,

cm: getColumnModel(),

height: 350,

selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),

enableColumnHide: true,

enableColumnMove: true,

stripeRows: true,

tbar:tb,

bbar: bbar

});

var win = new Ext.Window({

closable: true,

width: 820,

height: 420,

x: 230,

y: 100,

plain: true,

items: [{

region: 'center',

title: '例子',

items: [grid]

}]

});

win.show();

}

//添加

function showCreateUserDialog(){

var editDialog;

var editForm;

editForm = new Ext.FormPanel({

labelAlign: 'right',

url:'',

bodyStyle:'padding:5px 5px 0',

autoScroll: true,

items:[

new Ext.form.TextField({

fieldLabel: 'ID',

readOnly: false,

allowBlank:false,

width: 180,

maxLength: 32

}),

new Ext.form.TextField({

fieldLabel: '流程ID',

readOnly: false,

allowBlank:false,

width: 180,

maxLength: 32

}),

new Ext.form.TextField({

fieldLabel: '機關',

allowBlank:false,

width: 180,

maxLength: 50

}),

new Ext.form.TextField({

fieldLabel: '傳真',

allowBlank:false,

width: 180,

maxLength: 50

}),

new Ext.form.TextField({

fieldLabel: '發送時間',

allowBlank:false,

width: 180,

maxLength: 50,

renderer: Ext.util.Format.dateRenderer('Y-n-j G:i')

}),

new Ext.form.Hidden({

})

]

});

editDialog = new Ext.Window({

el: 'edit-user-dlg',

width:360,

height:302,

resizable: false,

title: '編輯',

//border:false,

closeAction:'hide',

plain:true,

modal: true,

items: [editForm],

buttons: [{

text: '儲存',

handler: doSaveAction

},{

text: '取消',

handler: function() {

editDialog.hide();

}

}]

});

document.getElementById("edit-user-dlg").innerHTML='';

editDialog.show();

function doSaveAction(){

var form = editForm.getForm();

if(!form.isValid()){

Ext.MessageBox.alert('提示','資料不正确');

return;

}

//儲存資料

var formData = {id: '',wf_id: '',dept_name: '',fax: '',send_time: ''};

formData.id = form.findField('id').getValue();

formData.dept_name = form.findField('deptname').getValue();

formData.fax = form.findField('fax').getValue();

formData.wf_id = form.findField('wfid').getValue();

formData.send_time = form.findField('sendtime').getValue();

//alert(formData.dept_name+', ' + formData.fax + ', ' + formData.id +', ' +formData.send_time +', ' +formData.wf_id);

AddHideColumn.insert(formData,isSucc);

function isSucc(flag){

var msg = '失敗';

if(flag>0){

msg = '成功';

}

Ext.MessageBox.alert('提示','操作'+msg);

editDialog.hide();

ds.reload();

}

//修改

function doEdit(){

var chks = grid.getSelections();

if(chks.length>1){

Ext.MessageBox.alert('提示','編輯時隻能選擇一行');

return;

}

else if(chks.length == 0){

Ext.MessageBox.alert('提示','沒選擇任何行');

return;

}

else{

document.getElementById("edit-user-dlg").innerHTML='';

cinfirmEdit();

}

function cinfirmEdit(){

var editDialog;

var editForm;

var leType = Ext.data.Record.create([

{name:"id",type:"string"},

{name:"wfid",type:"string"},

{name:"deptname",type:"string"},

{name:"fax",type:"string"},

{name:"sendtime",type:"date"}

]);

editForm = new Ext.FormPanel({

labelAlign: 'right',

url:'',

bodyStyle:'padding:5px 5px 0',

autoScroll: true,

items:[

new Ext.form.TextField({

fieldLabel: 'ID',

readOnly: true,

allowBlank:false,

width: 180,

maxLength: 32

}),

new Ext.form.TextField({

fieldLabel: '流程ID',

readOnly: false,

allowBlank:false,

width: 180,

maxLength: 32

}),

new Ext.form.TextField({

fieldLabel: '機關',

allowBlank:false,

width: 180,

maxLength: 50

}),

new Ext.form.TextField({

fieldLabel: '傳真',

allowBlank:false,

width: 180,

maxLength: 50

}),

new Ext.form.TextField({

fieldLabel: '發送時間',

allowBlank:false,

width: 180,

maxLength: 50,

renderer: Ext.util.Format.dateRenderer('Y-n-j G:i')

}),

new Ext.form.Hidden({

})

]

});

editDialog = new Ext.Window({

el: 'edit-user-dlg',

width:360,

height:302,

resizable: false,

title: '編輯',

//border:false,

closeAction:'hide',

plain:true,

modal: true,

items: [editForm],

buttons: [{

text: '儲存',

handler: doSaveAction

},{

text: '取消',

handler: function() {

editDialog.hide();

}

}]

});

editDialog.show();

fillEditForm(); //添充表單

function doSaveAction(){

var form = editForm.getForm();

if(!form.isValid()){

Ext.MessageBox.alert('提示','資料不正确');

return;

}

//儲存資料

var formData = {id: '',wf_id: '',dept_name: '',fax: '',send_time: ''};

formData.id = form.findField('id').getValue();

formData.dept_name = form.findField('deptname').getValue();

formData.fax = form.findField('fax').getValue();

formData.wf_id = form.findField('wfid').getValue();

formData.send_time = form.findField('sendtime').getValue();

//alert(formData.dept_name+', ' + formData.fax + ', ' + formData.id +', ' +formData.send_time +', ' +formData.wf_id);

AddHideColumn.insert(formData,isSucc);

function isSucc(flag){

var msg = '失敗';

if(flag>0){

msg = '成功';

}

Ext.MessageBox.alert('提示','操作'+msg);

editDialog.hide();

ds.reload();

}

function fillEditForm(){

var chs = grid.getSelections();

var form = editForm.getForm();

var rowData = chs[0];

form.findField('wfid').setValue(rowData.get('wf_id'));

form.findField('deptname').setValue(rowData.get('dept_name'));

form.findField('fax').setValue(rowData.get('fax'));

form.findField('sendtime').setValue(rowData.get('send_time'));

form.findField('id').setValue(rowData.get('id'));

}

//删除

function doDel(){

var chs = grid.getSelections();

if(chs.length>0){

Ext.MessageBox.confirm('提示','是否确定删除?',confirmDel)

}

else{

Ext.MessageBox.alert('提示','還沒選者要删除的行!');

}

//确認删除

function confirmDel(btn){

if(btn == 'yes'){

var itms = new Array();

for(var i=0; i<chs.length; i++){

itms.push(chs[i].get("id"));

}

AddHideColumn.deleteFax(itms,isSucc);

}

//是否删除成功

function isSucc(flag){

var msg = '失敗';

if(flag>0){

msg = '成功';

}

Ext.MessageBox.alert('提示','操作'+msg);

ds.reload();

}

//顯示樹

function showTree(){

var nodeId;

document.getElementById("view-group-tree-dlg").innerHTML='';

var loader = new Ext.tree.DWRTreeLoader(TreeService.queryByNodeId, []);

var root = new Ext.tree.AsyncTreeNode({text: '中國', id:'1000'});

var tree = new Ext.tree.TreePanel({

id: 'deptTree',

loader:new Ext.tree.DWRTreeLoader(TreeService.queryByNodeId, {}, []),

border:false,

root:root

});

var treeEditer = new Ext.tree.TreeEditor(

Ext.getCmp('deptTree'),//将tree組建的執行個體放入

{

id:'tree-eidtTree',

allowBlank: false//輸入的值不可以為空

}

);

tree.on('contextmenu',function(node,event){

nodeId = node.id;

event.preventDefault(); //這行是必須的

rightClick.showAt(event.getXY());//取得滑鼠點選坐标，展示菜單

});

//右鍵菜單

var rightClick = new Ext.menu.Menu({

id :'rightClickCont',

items : [{

id:'addNode',

text : '添加',

menu:[

{

id:'insertNode',

text:'添加同級節點',

handler : function() {

showCreateUserDialog();

}

{

id:'appendNode',

text:'添加子節點',

handler : function(){

showCreateUserDialog();

}

]

}, {

id:'delNode',

text : '删除',

handler : function() {

showCreateUserDialog();

}

}, {

id:'editnode',

text : '修改',

handler : function() {

showCreateUserDialog();

}

}]

});

var viewDialog = new Ext.Window({

el: 'view-group-tree-dlg',

width:360,

height:302,

resizable: false,

title: '機構樹',

//border:false,

closeAction:'hide',

plain:true,

modal: true,

items: [tree],

buttons: [{

text: '關閉',

handler: function() {

viewDialog.hide();

}

}]

});

viewDialog.show();

}

}();

Ext.onReady(UI.init, UI);

--TreeService.java

package ext.service;

import java.sql.ResultSet;

import java.util.ArrayList;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

import ext.bean.Tree;

import ext.db.DBHelp;

public class TreeService {

public List queryByNodeId(String nodeId){

String sql = "select id,name,isLeaf,parentId, sortOrder from Docmnt_Content ";

sql += "where parentId ='" + nodeId +"'";

List<Object> nodeList = new ArrayList<Object>();

Map<String,Object> map = null;

try{

ResultSet rs = DBHelp.getStatement().executeQuery(sql);

while(rs.next()){

boolean bl = rs.getString("isLeaf").equals("1") ? true : false;

map = new HashMap<String,Object>();

map.put("id",rs.getInt("id"));

map.put("text", rs.getString("name"));

map.put("leaf",bl );

map.put("parentId",rs.getInt("parentId"));

map.put("sortOrder",rs.getInt("sortOrder"));

map.put("expandable", !bl);

nodeList.add(map);

System.out.println(bl + rs.getString("name") + rs.getString("isLeaf"));

}

}catch(Exception ex){

ex.printStackTrace();

}

return nodeList;

}

public int addNode(Tree tree){

String sql = "insert into Docmnt_Content(id,name,isLeaf,parentId,sortOrder) values('"+ tree.getId() +"','";

sql+= tree.getName() +"','" + tree.getLeaf() +"','" + tree.getParentId() +"',0)";

try{

DBHelp.getStatement().executeQuery(sql);

}catch(Exception ex){

ex.printStackTrace();

return 0;

}

return 1;

}

--AddHideColumn.java

package ext.service;

import java.sql.ResultSet;

import java.util.ArrayList;

import java.util.List;

import org.apache.commons.lang.ArrayUtils;

import ext.bean.FAX;

import ext.bean.ListRange;

import ext.bean.Column;

import ext.db.DBHelp;

public class AddHideColumn {

public List queryColumns(String uid,String url){

String qSql = "select * from t_hideColumn where id='"+ uid +"' and url ='" + url +"'";

List<String> columns = null;

try{

ResultSet rs = DBHelp.getStatement().executeQuery(qSql);

if(rs.next()){

columns = new ArrayList<String>();

String col =rs.getString(3);

String colArr[] = col.split(";");

for(int i=0;i<colArr.length ;i++){

if(!"".equals(colArr[i]))

columns.add(colArr[i]);

}

catch(Exception ex){

System.out.println("查詢列資料失敗...");

}

return columns;

}

public ListRange getList(int startPosition, int maxResults, String orderBy){

List<FAX> list = new ArrayList<FAX>();

String qSql = "select * from zsy_fax_status_temp";

try{

ResultSet rs = DBHelp.getStatement().executeQuery(qSql);

while(rs.next()){

FAX fax = new FAX();

fax.setId(rs.getString("id"));

fax.setDept_name(rs.getString("dept_name"));

fax.setFax(rs.getString("fax"));

fax.setWf_id(rs.getString("wf_id"));

fax.setSend_time(rs.getString("send_time"));

list.add(fax);

}

}catch(Exception ex){

ex.printStackTrace();

}

FAX[] FAXArray = list.toArray(new FAX[0]);

ListRange result = new ListRange();

result.setTotalSize(list.size());

int start = startPosition;

int end = maxResults < 0 ? Integer.MAX_VALUE : start + maxResults;

result.setData(ArrayUtils.subarray(FAXArray, start, end));

return result;

}

public String insert(FAX obj){

String dSql = "delete from zsy_fax_status_temp where id='" + obj.getId() +"'";

String sql = "insert into zsy_fax_status_temp(id,wf_id,dept_name,fax,send_time) values('";

sql+= obj.getId() + "','" + obj.getWf_id() + "','" + obj.getDept_name() + "','" + obj.getFax() + "','";

sql+= obj.getSend_time() + "')";

try{

DBHelp.getStatement().execute(dSql);

DBHelp.getStatement().execute(sql);

}catch(Exception ex){

ex.printStackTrace();

System.out.println("添加資料失敗...");

return "0";

}

return "1";

}

public String deleteFax(String id[]){

String sql = "delete from zsy_fax_status_temp where id ='";

try{

for(int i=0; i<id.length ;i++){

sql = sql + id[i]+"'";

DBHelp.getStatement().execute(sql);

}

}catch(Exception ex){

ex.printStackTrace();

System.out.println("删除資料失敗...");

return "0";

}

return "1";

}

ext+dwr完整的例子(包括樹,增删改查等)

繼續閱讀

ASP程式設計中20個非常有用的例子

龍珠訓練營task04

阿裡雲天池龍珠計劃SQL訓練營打卡

阿裡雲天池龍珠計劃SQL訓練營day1

實驗樓sql進階之成績管理系統的資料操作(window)

前後端分離之跨域問題

DOS指令(2) 磁盤操作類指令

在DOS下運作不了ipconfig指令

Oracle的基本操作

tabpanel 使用問題

SQL優化SQL語句優化的目的

JAVA高效程式設計指南

關于SQL語言

SQL語言基礎：常用的資料查詢語句

neo4j之cypher使用文檔

sqlServer根據經緯查距離