Hi all,
I've create a custom trigger field (to be used as editor on a grid cell). The field must open a menù with a list of checkable items: very simple!
But when the onTriggerClick event fires, and the menù have to be build, I have always the same error: this.addEvents is not a function in ext-all.js (line 111). I cannot understand where is the problem.
Thanks!
Antonia.
This is my field code:
/*
* Ext JS Library 2.0
* (c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
/**
* @class FileTypesField
* @extends Ext.form.TriggerField
* Provides a file types input field with a dropdown menù of selectable file types.
* @constructor
* Create a new FileTypesField
* @param {Object} config
*/
FileTypesField = Ext.extend(Ext.form.TriggerField, {
fileTypesList: ,
fileMenu: null,
triggerClass : 'x-form-date-trigger',
// private
defaultAutoCreate : {
tag: "input",
type: "text",
size: "10",
autocomplete: "off"},
initComponent : function(){
fileTypesList = ;
FileTypesField.superclass.initComponent.call(this) ;
},
// private
validateValue : function(value){
value = this.formatFileTypesList();
if(!FileTypesField.superclass.validateValue.call(t his, value)){
return false;
}
if(value.length < 1){
// no emtpy file list possibile
return false;
}
return true;
},
// private
// Provides logic to override the default TriggerField.validateBlur which just returns true
validateBlur : function(){
return !this.fileMenu !this.fileMenu.isVisible();
},
2008-11-12 Dave Beckett * src/rasqal_engine_algebra.c, src ::
(rasqal_triples_rowsource_get_next_row): Do not trigger reset when last .. src/rasqal_query_results.c: (rasqal_new_query_results): Just init fields,
http://librdf.org/rasqal/ChangeLogHOME |
getValue : function(){
return this.formatFileTypesList() "";
},
setValue : function(){
FileTypesField.superclass.setValue.call(this, this.formatFileTypesList());
},
// private
onDestroy : function(){
if(this.wrap){
this.wrap.remove();
}
FileTypesField.superclass.onDestroy.call(this);
},
// private
formatFileTypesList : function(){
var fileList = '';
for (i= 0; i < this.fileTypesList.length; i++) {
fileList += this.fileTypesList[i] + '';
}
fileList = fileList.substring(fileList.length - 1);
return fileList;
},
// private
// Implements the default empty TriggerField.onTriggerClick function to display the DatePicker
onTriggerClick : function(){
if(this.disabled){
return;
}
if(this.fileMenu == null){
this.fileMenu = Ext.menu.Menu();
}
Ext.apply(this.fileMenu, {
items: [
{
text: 'txt',
checked: true,
checkHandler: this.onItemCheck
},
{
text: 'doc',
checked: false,
checkHandler: this.onItemCheck
},
{
text: 'xml',
checked: false,
checkHandler: this.onItemCheck
}
]
});
this.fileMenu.on(Ext.apply({}, this.menuListeners, {
scope:this
}));
// select menù items depending on the valur TO DO
this.fileMenu.show(this.el, "tl-bl?");
},
// private
menuListeners : {
show : function(){ // retain focus styling
this.onFocus();
},
hide : function(){
this.focus.defer(10, this);
var ml = this.menuListeners;
this.fileMenu.un("show", ml.show, this);
this.fileMenu.un("hide", ml.hide, this);
}
},
beforeBlur : function(){
var v = this.formatFileTypesList();
if(v){
this.setValue(v);
}
},
onItemCheck : function(item, checked){
if(checked){
this.fileTypesList.push(item.text);
}else{
var name = item.text;
var i = 0;
while(i < this.fileTypesList.length){
if(this.fileTypesList[i] == name){
this.fileTypesList.splice(i, 1);
}else{
i++;
}
}
}
}
});
Ext.reg('filetypesfield', FileTypesField);
Thanks! In fact there was other problems around! But now here is my component working as expeted. The user select file types using the menù, and the field diplay the list of types pipe separated.
Thanks again.
Antonia.
/**
* @class FileTypesField
* @extends Ext.form.TriggerField
* Provides a file types input field with a dropdown menù of selectable file types.
* @constructor
* Create a new FileTypesField
* @param {Object} config
*/
FileTypesField = Ext.extend(Ext.form.TriggerField, {
fileTypesList: ,
fileMenu: null,
triggerClass : 'x-form-date-trigger',
// private
defaultAutoCreate : {
tag: "input",
type: "text",
size: "10",
autocomplete: "off"},
initComponent : function(){
FileTypesField.superclass.initComponent.call(this) ;
},
// private
validateValue : function(value){
if(!FileTypesField.superclass.validateValue.call(t his, value)){
return false;
}
if(value.length < 1){
// no emtpy file list possibile
return false;
}
return true;
},
// private
// Provides logic to override the default TriggerField.validateBlur which just returns true
validateBlur : function(){
return !this.fileMenu !this.fileMenu.isVisible();
},
getValue : function(){
// dalla lista dei tipi di file, ricavo la stringa
// pipe separated
return this.formatFileTypesList(this.fileTypesList);
},
setValue : function(value){
// dalla strings pipe separated ricavo l'array
FileTypesField.superclass.setValue.call(this, value);
},
// private
onDestroy : function(){
if(this.wrap){
this.wrap.remove();
}
FileTypesField.superclass.onDestroy.call(this);
},
// private
formatFileTypesList : function(list){
var fileList = '';
for (i = 0; i < list.length; i++) {
var ft = list[i];
if(i < list.length - 1)
fileList += ft + ' ';
else fileList += ft;
}
return fileList;
},
fileTypeSelected: function(name){
for (i= 0; i < this.fileTypesList.length; i++) {
if(name == this.fileTypesList[i])
return true;
}
return false;
},
fillFileList: function(){
if(!this.value){
this.fileTypesList = ;
return;
}
var splitted = this.value.split("");
var type = '';
for (i=0; i < splitted.length; i++) {
type = splitted[i].replace(/^s*/, "").replace(/s*$/, "");
if(type.length > 2)
this.fileTypesList.push(type);
}
},
// private
// Implements the default empty TriggerField.onTriggerClick function to display the DatePicker
onTriggerClick : function(){
if(this.disabled){
return;
}
this.fileTypesList = ;
this.fillFileList();
if(this.fileMenu != null){
this.fileMenu.destroy();
}
this.fileMenu = new Ext.menu.Menu({
items: [{
text: 'txt',
checked: this.fileTypeSelected('txt'),
scope: this,
checkHandler: this.onItemCheck
}, {
text: 'doc',
checked: this.fileTypeSelected('doc'),
scope: this,
checkHandler: this.onItemCheck
}, {
text: 'xml',
checked: this.fileTypeSelected('xml'),
scope: this,
checkHandler: this.onItemCheck
}, {
text: 'pdf',
checked: this.fileTypeSelected('pdf'),
scope: this,
checkHandler: this.onItemCheck
}, {
text: 'xls',
checked: this.fileTypeSelected('xls'),
scope: this,
checkHandler: this.onItemCheck
}
]
});
this.fileMenu.on(Ext.apply({}, this.menuListeners, {
scope:this
}));
this.fileMenu.show(this.el, "tl-br?");
},
// private
menuListeners : {
show : function(){ // retain focus styling
this.onFocus();
Communication & Control::
File Format: Microsoft Powerpoint - View as HTMLEvent-by-Event Comm. w/ Trigger; Lines to FRC are OR of all boards; SCL Init / Restart from FRC; Busy / Error / Init Ack to FRC; Each board must define
http://www.nevis.columbia.edu/~evans/stt/talks/fnal0899_comm.pptHOME |
(Paper) Oracle Interview?Questions And Answers Set - 5 | Interview ::
What is the difference between ON-VALIDATE-FIELD trigger and a POST-CHANGE . Has the INIT.ORA parameter DB_FILE_MULTIBLOCK_READ_COUNT been changed?
http://placementpapers.net/helpingroot/oracle/Oracle-Interview-Questions-And-Answers-Set-5HOME |
},
hide : function(){
this.focus.defer(10, this);
var ml = this.menuListeners;
this.fileMenu.un("show", ml.show, this);
this.fileMenu.un("hide", ml.hide, this)
}
},
beforeBlur : function(){
var v = this.formatFileTypesList(this.fileTypesList);
if(v){
this.setValue(v);
}
},
onItemCheck : function(item, checked){
if(checked){
this.fileTypesList.push(item.text);
}else{
var name = item.text;
var i = 0;
while(i < this.fileTypesList.length){
if(this.fileTypesList[i] == name){
this.fileTypesList.splice(i, 1);
}else{
i++;
}
}
}
this.setValue(this.formatFileTypesList(this.fileTy pesList));
}
});
Ext.reg('filetypesfield', FileTypesField);
I'm re-posting your original code with added missing new keyword in bold and red. I'm not saying this is the only problem though.
/*
* Ext JS Library 2.0
* (c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
/**
* @class FileTypesField
* @extends Ext.form.TriggerField
* Provides a file types input field with a dropdown menù of selectable file types.
* @constructor
* Create a new FileTypesField
* @param {Object} config
*/
FileTypesField = Ext.extend(Ext.form.TriggerField, {
fileTypesList: ,
fileMenu: null,
triggerClass : 'x-form-date-trigger',
// private
defaultAutoCreate : {
tag: "input",
type: "text",
size: "10",
autocomplete: "off"},
initComponent : function(){
fileTypesList = ;
FileTypesField.superclass.initComponent.call(this) ;
},
// private
validateValue : function(value){
value = this.formatFileTypesList();
if(!FileTypesField.superclass.validateValue.call(t his, value)){
return false;
}
if(value.length < 1){
// no emtpy file list possibile
return false;
}
return true;
},
// private
// Provides logic to override the default TriggerField.validateBlur which just returns true
validateBlur : function(){
return !this.fileMenu !this.fileMenu.isVisible();
},
getValue : function(){
return this.formatFileTypesList() "";
},
setValue : function(){
FileTypesField.superclass.setValue.call(this, this.formatFileTypesList());
},
// private
onDestroy : function(){
if(this.wrap){
this.wrap.remove();
}
FileTypesField.superclass.onDestroy.call(this);
},
// private
formatFileTypesList : function(){
var fileList = '';
for (i= 0; i < this.fileTypesList.length; i++) {
fileList += this.fileTypesList[i] + '';
}
fileList = fileList.substring(fileList.length - 1);
return fileList;
},
// private
// Implements the default empty TriggerField.onTriggerClick function to display the DatePicker
onTriggerClick : function(){
if(this.disabled){
return;
}
if(this.fileMenu == null){
this.fileMenu = new Ext.menu.Menu();
}
Ext.apply(this.fileMenu, {
items: [
{
text: 'txt',
checked: true,
checkHandler: this.onItemCheck
},
{
text: 'doc',
checked: false,
checkHandler: this.onItemCheck
},
{
text: 'xml',
checked: false,
checkHandler: this.onItemCheck
}
]
});
this.fileMenu.on(Ext.apply({}, this.menuListeners, {
scope:this
}));
// select menù items depending on the valur TO DO
this.fileMenu.show(this.el, "tl-bl?");
},
// private
menuListeners : {
show : function(){ // retain focus styling
this.onFocus();
},
hide : function(){
this.focus.defer(10, this);
var ml = this.menuListeners;
this.fileMenu.un("show", ml.show, this);
this.fileMenu.un("hide", ml.hide, this);
}
},
beforeBlur : function(){
var v = this.formatFileTypesList();
if(v){
this.setValue(v);
}
},
onItemCheck : function(item, checked){
if(checked){
this.fileTypesList.push(item.text);
}else{
var name = item.text;
var i = 0;
while(i < this.fileTypesList.length){
if(this.fileTypesList[i] == name){
this.fileTypesList.splice(i, 1);
}else{
i++;
}
}
}
}
});
Ext.reg('filetypesfield', FileTypesField);
Thank you very much!
I really cannot see the missing 'new'.
Thanks also for the JS verifier link, I didn't know about it!
Antonia.
At the first glance at your code I've found two errors one of which is causing the problem.
First (unrelated): You create global variable fileTypesList in initComponent function.
Second (causing the problem you mention): You've missed new keyword:
onTriggerClick : function(){
if(this.disabled){
return;
}
if(this.fileMenu == null){
this.fileMenu = new Ext.menu.Menu();
}
BTW, do you use www.jslint.com? (http://www.jslint.com?) That would find that global.
 Nortel Unveils Vision, Strategy for Israeli High-Performance Net
 Busy Friday Leads to Strong Close for Net Stocks
|
Trigger field init problem