本文共 4322 字,大约阅读时间需要 14 分钟。
框架为struts2 1. jsp页面: - <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <%@taglib prefix="s" uri="/struts-tags"%>
- <%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
- <html xmlns="http://www.w3.org/1999/xhtml" >
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>种类指派</title>
- <!-- ExtJS library -->
- <link rel="stylesheet" type="text/css" href="css/ext/ext-all.css" />
- <script type="text/javascript" src="js/ext/ext-base.js"></script>
- <script type="text/javascript" src="js/ext/ext-all.js"></script>
- <script type="text/javascript" src="js/ext/edittree/categorychecktree.js"></script>
- <script type="text/javascript" src="js/ext/edittree/TreeCheckNodeUI.js"></script>
- <script type="text/javascript" src="js/ext/examples.js"></script>
- <link href="css/ext/ext-patch.css" type="text/css" rel="stylesheet"/>
-
- <!-- Common Styles for the examples -->
- <link rel="stylesheet" type="text/css" href="css/ext/examples.css" />
-
-
- <style type="text/css">
- .complete .x-tree-node-anchor span {
- text-decoration: line-through;
- color: #777;
- }
- .x-tree-node .root{
- background-image: url(css/images/default/tree/category.png)
- }
- </style>
- </head>
- <body style="padding:0 0 0 ;">
- <!-- EXAMPLES -->
- <div id="tree-div" ></div>
- <input type="hidden" id="name" name="name" value='<s:property value="product.name"/>'/>
- <input type="hidden" id="productid" name="productid" value='<s:property value="productid"/>'/>
- </body>
- </html>
2.categorychecktree.js -
-
-
-
-
-
-
- Ext.onReady(function(){
- var tree = new Ext.tree.TreePanel({
- renderTo:'tree-div',
-
- align:'center',
- height: 300,
- width: 400,
- useArrows:true,
- autoScroll:true,
- animate:true,
-
- containerScroll: true,
- expanded:true,
- rootVisible: false,
- checkModel:'single',
- onlyLeafCheckable:true,
- frame: true,
- root: {
- nodeType: 'async',
- text:'选择类别' ,
- iconCls:''
- },
- loader: new Ext.tree.TreeLoader({
- dataUrl: 'categorycheckjson.action?productid='+document.getElementById('productid').value,
- baseAttrs: { uiProvider: Ext.ux.TreeCheckNodeUI }
- }),
-
- buttons: [{
- text: '指派种类',
- handler: function(){
- var categoryId = '', selNodes = tree.getChecked();
- var productid=document.getElementById('productid').value;
- if(selNodes.length==0){
- Ext.Msg.alert('提示','请选择指派种类');
- }
- Ext.each(selNodes, function(node){
- if(categoryId.length > 0){
- categoryId += ', ';
- }
-
- categoryId += node.attributes['categoryId'];
-
- Ext.MessageBox.confirm("确认","确定指派种类吗?",function(e){
- if (e == "yes") {
-
-
- Ext.Ajax.request({
- url: 'asignCategory.action',
- params: {categoryId:categoryId,productid:productid},
- method: 'POST',
- dataType:'json',
- success:function(form,action){
- var obj = Ext.util.JSON.decode(form.responseText);
- if(obj.success==true)
- {
- Ext.Msg.alert('指派成功',obj.msg);
- var win = parent.Ext.getCmp('win');
- if (win) {win.close();}
- }
- else
- {
-
- Ext.Msg.alert('指派错误',obj.msg);
- }
- },
-
- failure:function(){
- Ext.Msg.alert('错误','服务器出现错误请稍后再试!');
- }
- });
-
- } else if (e == "no") {
-
- } else if (e == "cancel") {
-
- }});
-
- });
- }
- },{
- text: '关闭',
- handler: function(){
- var win = parent.Ext.getCmp('win');
-
- if (win) {win.close();}
-
- }
- }]
- });
- tree.getRootNode().expand(true);
- tree.root.getUI().getIconEl().src ='';
-
-
-
-
- });
其中 json格式: - stcCallback1001({totalCount:"8",results:[{productid:"13",name:"考试",companyName:"教育",create_time:"2012-08-06 16:14:32"},{productid:"12",name:"ggg",companyName:"4546",create_time:"2012-08-06 16:13:29"},{productid:"11",name:"3434",companyName:"3444",create_time:"2012-08-06 16:12:44"},{productid:"10",name:"333",companyName:"fff",create_time:"2012-08-06 16:12:02"},{productid:"9",name:"考试",companyName:"教育",create_time:"2012-08-06 16:10:53"},{productid:"8",name:"999",companyName:"教育",create_time:"2012-08-06 16:09:36"},{productid:"7",name:"考试",companyName:"教育",create_time:"2012-08-06 16:08:20"},{productid:"6",name:"学",companyName:"教育",create_time:"2012-08-06 15:50:26"}]});
转载地址:http://zdlvi.baihongyu.com/