回答 2 已采纳 我用Ext3.0的EditorGridPanel,数据源定义如下：
var store = new Ext.data.JsonStore({
root: 'dataObj',
totalProperty: 'totalCount',
idProperty: 'id',
remoteSort: true,
autoSave:false,
fields: [
'id', 'name', 'categoryId','descn',
{name:'price', type:'float'},
{name: 'publishDate', type: 'date', dateFormat: 'Y-m-d'}
],
//url: '/griddemo/grid/extgrid.do'
proxy : new Ext.data.HttpProxy({
method: 'GET',
listful: true,
//prettyUrls: false,
url: '/griddemo/grid/extgrid.do',
api: {
// all actions except the following will use above url
//read : '',
create : '/griddemo/grid/extgrid/add.do',
update : '/griddemo/grid/extgrid/update.do',
destroy : '/griddemo/grid/extgrid/del.do'
}
}),
writer: new Ext.data.JsonWriter({
encode: true,
writeAllFields: false
})
});
当点击按钮触发事件方法，调用store.save()方法提交到'/griddemo/grid/extgrid/update.do'，后台将如何接收提交的修改？后台使用Java
回答 7 已采纳 有这样一个combotree：
[code="javascript"]
items: [{
xtype: 'combotree',
fieldLabel: '推荐产品',
id: 'recommend_product',
name: 'product',
hiddenName: 'recommend_product',
blankText: '必须选择一款产品！',
emptyText: '请选择产品……',
autoHeight: true,
resizable: true,
tree: new Ext.tree.TreePanel({
rootVisible: false,
hideBorders: true,
border: false,
root: new Ext.tree.AsyncTreeNode({
id: 'CategoryRoot',
text: "",
loader: new Ext.tree.TreeLoader({
dataUrl: '/product/show_product_by_type_tree/tree.json',
requestMethod: 'GET',
preloadChildren: false,
clearOnLoad: false,
})
})
}),
anchor: '90%',
allowBlank: false
}]
[/code]
我想取出它的选中项的Value(不是text)的话，应该怎么做啊？是在后台还是前台啊？完全没有头绪的说……
[b]问题补充：[/b]
呃……我用的是这样一个文件，貌似里面没有setValue和getValue的方法？
唉，哪怕有个API看看也好啊 :?
[code="javascript"]
/**
* 下拉树ComboBoxTree
* @extend Ext.form.ComboBox
* @xtype 'combotree'
*
* @author chengbao_zhu
*/
/**
* ----------------------
* Demo ComboBoxTree
* ----------------------
*/
/*-------------------------------------------------*
treecombo = {
fieldLabel : '片 源 类 别',
width : 127,
xtype : 'combotree',
passName : 'videoCategory',
allowUnLeafClick : false,
treeHeight:200,
tree : new Ext.tree.TreePanel({
rootVisible : false,
root : new Ext.tree.AsyncTreeNode({
id : 'CategoryRoot',
text : "影片分类",
expanded : true,
loader : new Ext.tree.TreeLoader({
dataUrl : UrlPpts.ajax.vdocategory + '?method=tree'
})
})
}),
allowBlank : false
}
*-----------------------------------------------------*/
ComboBoxTree = Ext.extend(Ext.form.ComboBox, {
/**
* -------------------------------------
* 作为隐藏域的name属性
* -------------------------------------
*/
passName : 'id',
/**
* -------------------------------------
* 是否允许非叶子结点的单击事件
*
* @default false
* -------------------------------------
*/
allowUnLeafClick : true,
/**
* ---------------------
* 树渲染的模板tpl
* ---------------------
*/
// tpl: '', //html代码
/**
* -----------------------
* 树显示的高度，默认为180
* -----------------------
*/
treeHeight : 180,
store : new Ext.data.SimpleStore({
fields : [],
data : [[]]
}),
//Default
editable : false, // 禁止手写及联想功能
mode : 'local',
triggerAction : 'all',
maxHeight : 500,
selectedClass : '',
onSelect : Ext.emptyFn,
emptyText : '请选择...',
/**
* 清空值
*/
clearValue : function() {
if (this.passField) {
this.passField.value = '';
}
this.setRawValue('');
},
/**
* 设置传值
* @param passvalue
*/
setPassValue: function(passvalue){
if (this.passField)
this.passField.value = passvalue;
},
/**
* --------------------------------------
* 下拉树被点击事件添加一处理方法
* @param node
* --------------------------------------
*/
onTreeSelected : function(node) {
},
/**
* ----------------------------------
* 树的单击事件处理
* @param node,event
* ----------------------------------
*/
treeClk : function(node, e) {
if (!node.isLeaf() && !this.allowUnLeafClick) {
e.stopEvent();// 非叶子节点则不触发
return;
}
this.setValue(node.text);// 设置option值
this.collapse();// 隐藏option列表
if (this.passField)
this.passField.value = node.id;// 以树的节点ID传递
// 选中树节点后的触发事件
this.fireEvent('treeselected', node);
},
/**
* 初始化
* Init
*/
initComponent : function() {
ComboBoxTree.superclass.initComponent.call(this);
this.tree.autoScroll = true;
//this.tree.height = this.treeHeight;
this.tree.containerScroll = false;
this.tplId = Ext.id();
// overflow:auto"
this.tpl = '';
/**
* -----------------------
* 添加treeselected事件，
* 选中树节点会激发这个事
* 件， 参数为树的节点
* ------------------------
*/
this.addEvents('treeselected');
// this.on('treeselected',this.onTreeSelected,this);
},
/**
* ------------------
* 事件监听器
* Listener
* ------------------
*/
listeners : {
'expand' : {
fn : function() {
if (!this.tree.rendered && this.tplId) {
this.tree.render(this.tplId);
}
this.tree.show();
},
single : true
},
'render' : {
fn : function() {
this.tree.on('click', this.treeClk, this);
/**
* -------------------------------------------
* 创建隐藏输入域
* 并将其dom传给passField
* ------------------------------------------
*/
if (this.passName) {
this.passField = this.getEl().insertSibling({
tag : 'input',
type : 'hidden',
name : this.passName,
id : this.passId || Ext.id()
}, 'before', true)
}
this.passField.value = this.passValue !== undefined
? this.passValue
: (this.value !== undefined ? this.value : '');
this.el.dom.removeAttribute('name');
}
},
'beforedestroy' : {
fn : function(cmp) {
this.purgeListeners();
this.tree.purgeListeners();
}
}
}
});
/**
* ---------------------------------
* 将ComboBoxTree注册为Ext的组件,以便使用
* Ext的延迟渲染机制，xtype:'combotree'
* ---------------------------------
*/
Ext.reg('combotree', ComboBoxTree);
[/code]
[b]问题补充：[/b]
用了selectText，结果弹出来的是这样的精简过的代码(直接复制的，就不贴图了，其实是个alert框的)：
[code=""]
---------------------------
Microsoft Internet Explorer
---------------------------
function(h,a){var c=this.getRawValue();var e=false;if(c.length>0){h=h===undefined?0:h;a=a===undefined?c.length:a;var g=this.el.dom;if(g.setSelectionRange){g.setSelectionRange(h,a)}else{if(g.createTextRange){var b=g.createTextRange();b.moveStart("character",h);b.moveEnd("character",a-c.length);b.select()}}e=Ext.isGecko||Ext.isOpera}else{e=true}if(e){this.focus()}}
---------------------------
确定
---------------------------
[/code]
[b]问题补充：[/b]
汗，昨天半夜晕乎乎地，跑去alert……
我是要它的“value”呢，就是1，2这样的数字，但是用了combotree之后，再调用它的value，出来的也还是汉字的名称而不是数字……
[code="javascript"]Ext.getCmp("recommend_product").selectText(0,3);[/code]这样只是把它的文字选中而已啊
[b]问题补充：[/b]
呃，getValue()和getRawValue()出来的，也变成了汉字的名称，这个combotree是不是把这些都一股脑儿接管了啊……
[b]问题补充：[/b]
@蔡华江:
我最开始用到的就是您提供的那个控件，但它有一个让我束手无策的问题：失去焦点时会自己把值清空，后来没办法才用的我发的那个版本的。
不知您是用什么方法来避免“失去焦点时清空值”这一问题的呢？
[b]问题补充：[/b]
[code="javascript"]items: [{
xtype: 'combotree',
fieldLabel: '推荐产品',
id: 'recommend_product',
name: 'module',
hiddenName: 'question.module',
blankText: '必须选择一款产品！',
emptyText: '请选择产品……',
autoHeight: true,
resizable: true,
tree: product_tree,
anchor: '90%',
allowBlank: false
}]
[/code]
我是这么调用的，然后就有取不回值的问题。
不知道您方便把您的代码给我一份吗？我的信箱hexawing#163.com，先谢谢了！
回答 2 已采纳 我想写一个store 取数据库的值然后遍历出来放到下面的items里面。。。
如何遍历？？
大体如何写？？
急等。。。
var Viewport = new Ext.Viewport({ //注意这里是Viewport，NO ViewPort
enableTabScroll:true,
layout:"border",
renderTo:"fenyeye",//呈现
items:[{
region:"north", //顶部面板
height:180,
html:''
},
{
xtype:"tabpanel", //选项卡
region:"center",
items:[{title:"首页",html:'面板1内容'},
{title:"新闻",width:'100',html:'面板2内容'},
{title:"培训",width:'500',html:'面板2内容'},
{title:"论坛",width:'500',html:'面板2内容'},
{title:"博客",width:'500',html:'面板2内容'},
{title:"新闻",width:'500',html:'面板2内容'},
{title:"法规",width:'500',html:'面板3内容'}]
}
]
});