如何Extjs将Excel导入到数据库

Extjs把excel数据导入数据库中的 *** 作办法：

1、使用DataDrop – Drag Grid Data in From a Spreadsheet

2、在利用extjs *** 作db接口把data-grid中的数据插入到db中就可以了。

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

}

]

})

//创建d出窗口

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/jsoncharset=UTF-8")

response.getWriter().write("{success:"+isSuccess+",bookTypeId:"+bookTypeId+"}")

return null

}

。。。。。。。。。

其他的应该不用帖了吧

还有不懂得 你可以继续补充

var myData = [

['2008-08-05 12:11:11',0.03],

['2008-09-06 12:07:19',1.63]

]

store.loadData(myData)

var grideast = new Ext.grid.GridPanel({

store: store,

})

重新创建myData数组，再调用 store.loadData(myData)就行。

---