From 8894c69dec4ecbf4ea3ff20cac0a0cc80ae8df03 Mon Sep 17 00:00:00 2001
From: Renaud Le Gac <renaud.legac@free.fr>
Date: Wed, 27 Jan 2010 21:31:28 +0000
Subject: [PATCH] Introduce the App.form.ComboBox.
---
controllers/default.py | 1 +
static/appjs/appcombobox.js | 81 +++++++++++++++++++++++++++++++++++++
static/script/combo_2.js | 40 ++----------------
3 files changed, 86 insertions(+), 36 deletions(-)
create mode 100644 static/appjs/appcombobox.js
diff --git a/controllers/default.py b/controllers/default.py
index 9f02c091..3d19415c 100644
--- a/controllers/default.py
+++ b/controllers/default.py
@@ -73,6 +73,7 @@ def index():
os.path.join(base, 'static', 'appjs', 'combobox.js'),
os.path.join(base, 'static', 'appjs', 'entryform.js'),
os.path.join(base, 'static', 'appjs', 'vieweditgrid.js'),
+ os.path.join(base, 'static', 'appjs', 'appcombobox.js'),
os.path.join(base, 'static', 'appjs', 'appgrid.js'),
os.path.join(base, 'static', 'appjs', 'appgridroweditor.js'),
os.path.join(base, 'static', 'appjs', 'appgridrowcontextmenu.js'),
diff --git a/static/appjs/appcombobox.js b/static/appjs/appcombobox.js
new file mode 100644
index 00000000..b2acc862
--- /dev/null
+++ b/static/appjs/appcombobox.js
@@ -0,0 +1,81 @@
+/**
+ * A pre-configured combobox reading its data in the database.
+ * Design to work with the class HttpDb on the server side.
+ *
+ * MANDATORY PROPERTIES:
+ * - table the name of the database table
+ * - displayField field of the table shown in the combobox
+ * - valueField field of the table return by the combobox
+ *
+ * All configuration properties of Ext.form.ComboBox are understood.
+ *
+ * @extends Ext.form.ComboBox
+ * @author $Author$
+ * @version $Id$
+ *
+ */
+Ext.namespace('App.form');
+
+App.form.ComboBox = Ext.extend(Ext.form.ComboBox, {
+
+ /**
+ * @cfg {String} the database table where data are retrieve.
+ * This parameter is send to the server as a baseParams.
+ * This parameter is mandatory.
+ */
+ table: null,
+
+ /**
+ * @cfg {Boolean} actiate the debug on the server side
+ * This parameter is send to the server as a baseParams.
+ */
+ debug: false,
+
+ /**
+ * Predefined setting
+ *
+ */
+ mode:'remote',
+ selectOnFocus: true,
+ triggerAction: 'all',
+ typeAhead: true,
+
+ /**
+ * The constructor
+ * @param {Object} config
+ */
+ constructor: function(config){
+
+ Ext.apply(this, config);
+
+ // defined the empty text from the field label
+ if(this.fieldLabel && !this.emptyText){
+ this.emptyText = "Select a "+this.fieldLabel+" ...";
+ }
+
+ // setup the store if not defined by the user
+ // the autoLoad property set at true is mandatory to
+ // set a value when the combobox is not yet expend
+ if (!this.store) {
+ this.store = new App.data.JsonStore({
+ url: App.dburl,
+ table: this.table,
+ tableFields: [this.valueField, this.displayField],
+ sortInfo: {field: this.displayField},
+ debug: this.debug,
+ autoLoad: true,
+ });
+ }
+
+ // construct the underlying class. DON'T MOVE
+ App.ComboBox.superclass.constructor.apply(this);
+
+ // This few lines are required to set a value
+ // when the combobox is not yet expend
+ this.store.on('load', function(){
+ this.setValue(this.getValue());
+ }, this);
+ },
+});
+
+Ext.reg('xcombobox', App.form.ComboBox);
diff --git a/static/script/combo_2.js b/static/script/combo_2.js
index 9a94206b..3c030c5f 100644
--- a/static/script/combo_2.js
+++ b/static/script/combo_2.js
@@ -6,16 +6,8 @@
* $Id$
*
*/
-Ext.namespace('App.combo');
-App.combo.ComboBox = Ext.extend(Ext.form.ComboBox, {
- mode: 'remote',
- selectOnFocus: true,
- triggerAction: 'all',
- typeAhead: true,
-});
-
/**
* main function
* The scope, this, contains the models return by the server
@@ -24,42 +16,18 @@ App.combo.ComboBox = Ext.extend(Ext.form.ComboBox, {
var main = function(){
// console.dir(this);
- var model = this.viewedit.rpmCategories.store;
- console.dir(model);
-
- var store = new App.data.JsonStore({
- url: App.dburl,
- table: model.table,
- tableFields: model.tableFields,
- debug: true,
- autoLoad: true,
- });
- // Here is the trick to set properly a user value
- // in the initialization phase.
- // the store have to be in autoLoad mode to force
- // the loading of the store.
- // then when it is load apply the user value.
- // Trick found on the extjs forum.
- // However when the user will select a new value the
- // store will be load again !
- store.on("load", function(){
- combo.setValue(combo.getValue());
- });
-
- var combo = new App.combo.ComboBox({
+ var combo = new App.form.ComboBox({
+ table: "rpmCategories",
displayField: "category",
- fieldLabel: "Category",
valueField: "id",
- hiddenName: "idcategory",
- emptyText: "Select a category... ",
- store: store,
+ fieldLabel: "Category",
});
combo.on("select", function(){
console.log(this.getValue());
});
-
+
form = new Ext.FormPanel({
renderTo: "appmain",
bodyStyle: 'padding:5px 5px 0',
--
GitLab