About an error with qx.ui.table.headerrenderer.HeaderCell

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

About an error with qx.ui.table.headerrenderer.HeaderCell

yeestrada

Hello everybody, i am working with  qx.ui.table.headerrenderer.HeaderCell and i found an example that works perfectly, but when i try to implement it in a class, it show this error:

TypeError: ga.sgop.common.models.headerRenderer is not a constructor

here is the code from the playground (it works perfectly):
............................................................................................................

qx.Class.define("myHeaderCell",
{
  extend : qx.ui.table.headerrenderer.HeaderCell,
 
  construct : function()
  {
    this.base(arguments);
  },
 
  members :
  {   
    // overridden
    _createChildControlImpl : function(id, hash)
    {
      var control;

      switch(id)
      {
        case "label":
          control = new qx.ui.basic.Label(this.getLabel()).set({
            anonymous: true,
            allowShrinkX: true,
            rich : true,
            wrap: true           
          });
          this._add(control, {row: 0, column: 1});
          break;
      }

      return control || this.base(arguments, id);
    }
  }
});

qx.Class.define("myHeaderRenderer",
{
  extend : qx.ui.table.headerrenderer.Default,
 
  members :
  {
      _getContextMenuA : function()
      {
        var menu = new qx.ui.menu.Menu();  
            var btn = new qx.ui.menu.CheckBox("Modificar").set({value: true});
            var btn1 = new qx.ui.menu.CheckBox("Eliminar").set({value: true});
            menu.add(btn);  
            menu.add(btn1);
            return menu;
        },
   
    // overridden
    createHeaderCell : function(cellInfo)
    {
      var widget = new myHeaderCell();
      widget.setContextMenu(this._getContextMenuA());
      this.updateHeaderCell(cellInfo, widget);

      return widget;
    }
  }
});



function createRandomRows(rowCount) {
  var rowData = [];
  var now = new Date().getTime();
  var dateRange = 400 * 24 * 60 * 60 * 1000; // 400 days
  var nextId = 0;
  for (var row = 0; row < rowCount; row++) {
    var date = new Date(now + Math.random() * dateRange - dateRange / 2);
    rowData.push([ nextId++, Math.random() * 10000, date, (Math.random() > 0.5) ]);
  }
  return rowData;
}


// window
var win = new qx.ui.window.Window("Table").set({
  layout : new qx.ui.layout.Grow(),
  allowClose: false,
  allowMinimize: false,
  contentPadding: 0
});
this.getRoot().add(win);
win.moveTo(30, 40);
win.open();

// table model
var tableModel = new qx.ui.table.model.Simple();
tableModel.setColumns([ "ID", "A number dsfsdfolsdf sdfoldsfds fsdfsdofsd fds fsdkfsdnfs dfdsf", "A date", "Boolean" ]);
tableModel.setData(createRandomRows(1000));

// make second column editable
tableModel.setColumnEditable(1, true);

// table
var table = new qx.ui.table.Table(tableModel).set({
  decorator: null
});
win.add(table);

var tcm = table.getTableColumnModel();

// Display a checkbox in column 3
tcm.setDataCellRenderer(3, new qx.ui.table.cellrenderer.Boolean());

// use a different header renderer

table.setHeaderCellHeight(50);
tcm.setHeaderCellRenderer(1, new myHeaderRenderer);
tcm.setHeaderCellRenderer(3, new myHeaderRenderer);
............................................................................................................


Now, when i try to implement it in a class:

....................headerCell class.......................

qx.Class.define("ga.sgop.common.models.headerCell",
{
  extend : qx.ui.table.headerrenderer.HeaderCell,
 
  construct : function()
  {
    this.base(arguments);
  },
 
  members :
  {     
    // overridden
    _createChildControlImpl : function(id, hash)
    {
      var control;

      switch(id)
      {
        case "label":
          control = new qx.ui.basic.Label(this.getLabel()).set({
            anonymous: true,
            allowShrinkX: true,
            rich : true,
            wrap: true           
          });
          this._add(control, {row: 0, column: 1});
          break;
      }
      return control || this.base(arguments, id);
    }
  }
});

....................headerRenderer class.......................
qx.Class.define("ga.sgop.common.models.headerRenderer",
{
  extend : qx.ui.table.headerrenderer.Default,
 
//  properties:{
//    values: {init: [], nullable: false, event: changeValues} 
//  },
 
  members :
  {
      _getContextMenuA : function()
      {
        var menu = new qx.ui.menu.Menu();
//        values = this.getValues(),
//        i =0; 
//        while(values[i]){
//            var btn = new qx.ui.menu.CheckBox(values[i]).set({value: true});
//            menu.add(btn);
//            i++;
//        }
            var btn = new qx.ui.menu.CheckBox("Modificar").set({value: true});
            var btn1 = new qx.ui.menu.CheckBox("Eliminar").set({value: true});
            menu.add(btn);  
            menu.add(btn1);
            return menu;
        },
   
    // overridden
    createHeaderCell : function(cellInfo)
    {
      var widget = new ga.sgop.common.models.headerCell();
      widget.setContextMenu(this._getContextMenuA());
      this.updateHeaderCell(cellInfo, widget);
      return widget;
    }
  }
});

....................the example class....................
qx.Class.define("ga.ejemplo",
        {
    extend : qx.ui.window.Window,
   
    properties:{
        value: {check: 'Object', nullable: true, init: null, event: 'changeValue'},
        save: {check: 'Boolean', nullable: false, init: false, event: 'changeSave'}
    },
   
    include: [ga.sgop.common.actions.MTable],
   
    construct : function()
    {
        this.base(arguments,"Seleccionar estructura");
        this.set({
            showMinimize: false,
            showMaximize: false,
            width: 500,
            height: 420,
            modal: true,
            resizableBottom: false,
            resizableLeft: false,
            resizableRight: false,
            resizableTop: false,
//            allowMaximize: false,
//            allowMinimize: false,   
            layout: new qx.ui.layout.Canvas()
        });       
        this.center();
        this.initComponent();
    },
   
    members :
    {       
        initComponent : function()
        {   
            var tableModel = new qx.ui.table.model.Simple();
            tableModel.setColumns([ "ID", "A number dsfsdfolsdf sdfoldsfds fsdfsdofsd fds fsdkfsdnfs dfdsf", "A date", "Boolean" ]);
            tableModel.setData(this.createRandomRows(1000));
           
            // make second column editable
            tableModel.setColumnEditable(1, true);
           
            // table
            var table = new qx.ui.table.Table(tableModel).set({
              decorator: null
            });
            this.add(table);
           
            var tcm = table.getTableColumnModel();
           
            // Display a checkbox in column 3
            tcm.setDataCellRenderer(3, new qx.ui.table.cellrenderer.Boolean());
           
            // use a different header renderer
           
            table.setHeaderCellHeight(50);
            tcm.setHeaderCellRenderer(1, new ga.sgop.common.models.headerRenderer());
            tcm.setHeaderCellRenderer(3, new ga.sgop.common.models.headerRenderer());
        },
       
        createRandomRows: function(rowCount) {
          var rowData = [];
          var now = new Date().getTime();
          var dateRange = 400 * 24 * 60 * 60 * 1000; // 400 days
          var nextId = 0;
          for (var row = 0; row < rowCount; row++) {
            var date = new Date(now + Math.random() * dateRange - dateRange / 2);
            rowData.push([ nextId++, Math.random() * 10000, date, (Math.random() > 0.5) ]);
          }
          return rowData;
        }
    }       
       
});

Please, can someone tell me what is wrong??


------------------------------------------------------------------------------
October Webinars: Code for Performance
Free Intel webinars can help you accelerate application performance.
Explore tips for MPI, OpenMP, advanced profiling, and more. Get the most from
the latest Intel processors and coprocessors. See abstracts and register >
http://pubads.g.doubleclick.net/gampad/clk?id=60135031&iu=/4140/ostg.clktrk
_______________________________________________
qooxdoo-devel mailing list
[hidden email]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Reply | Threaded
Open this post in threaded view
|

Re: About an error with qx.ui.table.headerrenderer.HeaderCell

nminhtrung
This post has NOT been accepted by the mailing list yet.
Hi yeestrada,

I have tried the following things, and it works for me, please check this with yours again:

Configuration: qooxdoo desktop framework 3.0

Steps:
1) create-application.py -n ga
2) Folder structure: ('...' is placed for other things in the folder)
ga
|__source
     |__class
         |__ga
             |__sgop
                 |__common
                     |__models
                         |__headerCell.js
                         |__headerRenderer.js
             |__Application.js
             |__ejemplo.js
             |__...
     |__...
|__config.json
|__generate.py
|__Manifest.json
|__readme.txt

3) Coding:
3.1) headerCell.js, headerRenderer.js the same as yours (I copied them :) )
3.2) ejemplo.js is still the same. But I ignore your included mixin and method 'this.center'
3.2) Application.js:
qx.Class.define("ga.Application", {
        extend : qx.application.Standalone,
        members : {
            main : function() {
                        this.base(arguments);
                        if (qx.core.Environment.get("qx.debug")) {
                                qx.log.appender.Native;
                                qx.log.appender.Console;
                        }
                       
                        new ga.ejemplo().open();
            }
        }
});

Sincerely thanks,
NMT
Reply | Threaded
Open this post in threaded view
|

Re: About an error with qx.ui.table.headerrenderer.HeaderCell

Thomas Herchenroeder
In reply to this post by yeestrada
Did you run 'generate.py' after adding the class?

T.


On 10/14/2013 11:28 PM, Yordan Estrada wrote:

Hello everybody, i am working with  qx.ui.table.headerrenderer.HeaderCell and i found an example that works perfectly, but when i try to implement it in a class, it show this error:

TypeError: ga.sgop.common.models.headerRenderer is not a constructor

here is the code from the playground (it works perfectly):
............................................................................................................

qx.Class.define("myHeaderCell",
{
  extend : qx.ui.table.headerrenderer.HeaderCell,
 
  construct : function()
  {
    this.base(arguments);
  },
 
  members :
  {   
    // overridden
    _createChildControlImpl : function(id, hash)
    {
      var control;

      switch(id)
      {
        case "label":
          control = new qx.ui.basic.Label(this.getLabel()).set({
            anonymous: true,
            allowShrinkX: true,
            rich : true,
            wrap: true           
          });
          this._add(control, {row: 0, column: 1});
          break;
      }

      return control || this.base(arguments, id);
    }
  }
});

qx.Class.define("myHeaderRenderer",
{
  extend : qx.ui.table.headerrenderer.Default,
 
  members :
  {
      _getContextMenuA : function()
      {
        var menu = new qx.ui.menu.Menu();  
            var btn = new qx.ui.menu.CheckBox("Modificar").set({value: true});
            var btn1 = new qx.ui.menu.CheckBox("Eliminar").set({value: true});
            menu.add(btn);  
            menu.add(btn1);
            return menu;
        },
   
    // overridden
    createHeaderCell : function(cellInfo)
    {
      var widget = new myHeaderCell();
      widget.setContextMenu(this._getContextMenuA());
      this.updateHeaderCell(cellInfo, widget);

      return widget;
    }
  }
});



function createRandomRows(rowCount) {
  var rowData = [];
  var now = new Date().getTime();
  var dateRange = 400 * 24 * 60 * 60 * 1000; // 400 days
  var nextId = 0;
  for (var row = 0; row < rowCount; row++) {
    var date = new Date(now + Math.random() * dateRange - dateRange / 2);
    rowData.push([ nextId++, Math.random() * 10000, date, (Math.random() > 0.5) ]);
  }
  return rowData;
}


// window
var win = new qx.ui.window.Window("Table").set({
  layout : new qx.ui.layout.Grow(),
  allowClose: false,
  allowMinimize: false,
  contentPadding: 0
});
this.getRoot().add(win);
win.moveTo(30, 40);
win.open();

// table model
var tableModel = new qx.ui.table.model.Simple();
tableModel.setColumns([ "ID", "A number dsfsdfolsdf sdfoldsfds fsdfsdofsd fds fsdkfsdnfs dfdsf", "A date", "Boolean" ]);
tableModel.setData(createRandomRows(1000));

// make second column editable
tableModel.setColumnEditable(1, true);

// table
var table = new qx.ui.table.Table(tableModel).set({
  decorator: null
});
win.add(table);

var tcm = table.getTableColumnModel();

// Display a checkbox in column 3
tcm.setDataCellRenderer(3, new qx.ui.table.cellrenderer.Boolean());

// use a different header renderer

table.setHeaderCellHeight(50);
tcm.setHeaderCellRenderer(1, new myHeaderRenderer);
tcm.setHeaderCellRenderer(3, new myHeaderRenderer);
............................................................................................................


Now, when i try to implement it in a class:

....................headerCell class.......................

qx.Class.define("ga.sgop.common.models.headerCell",
{
  extend : qx.ui.table.headerrenderer.HeaderCell,
 
  construct : function()
  {
    this.base(arguments);
  },
 
  members :
  {     
    // overridden
    _createChildControlImpl : function(id, hash)
    {
      var control;

      switch(id)
      {
        case "label":
          control = new qx.ui.basic.Label(this.getLabel()).set({
            anonymous: true,
            allowShrinkX: true,
            rich : true,
            wrap: true           
          });
          this._add(control, {row: 0, column: 1});
          break;
      }
      return control || this.base(arguments, id);
    }
  }
});

....................headerRenderer class.......................
qx.Class.define("ga.sgop.common.models.headerRenderer",
{
  extend : qx.ui.table.headerrenderer.Default,
 
//  properties:{
//    values: {init: [], nullable: false, event: changeValues} 
//  },
 
  members :
  {
      _getContextMenuA : function()
      {
        var menu = new qx.ui.menu.Menu();
//        values = this.getValues(),
//        i =0; 
//        while(values[i]){
//            var btn = new qx.ui.menu.CheckBox(values[i]).set({value: true});
//            menu.add(btn);
//            i++;
//        }
            var btn = new qx.ui.menu.CheckBox("Modificar").set({value: true});
            var btn1 = new qx.ui.menu.CheckBox("Eliminar").set({value: true});
            menu.add(btn);  
            menu.add(btn1);
            return menu;
        },
   
    // overridden
    createHeaderCell : function(cellInfo)
    {
      var widget = new ga.sgop.common.models.headerCell();
      widget.setContextMenu(this._getContextMenuA());
      this.updateHeaderCell(cellInfo, widget);
      return widget;
    }
  }
});

....................the example class....................
qx.Class.define("ga.ejemplo",
        {
    extend : qx.ui.window.Window,
   
    properties:{
        value: {check: 'Object', nullable: true, init: null, event: 'changeValue'},
        save: {check: 'Boolean', nullable: false, init: false, event: 'changeSave'}
    },
   
    include: [ga.sgop.common.actions.MTable],
   
    construct : function()
    {
        this.base(arguments,"Seleccionar estructura");
        this.set({
            showMinimize: false,
            showMaximize: false,
            width: 500,
            height: 420,
            modal: true,
            resizableBottom: false,
            resizableLeft: false,
            resizableRight: false,
            resizableTop: false,
//            allowMaximize: false,
//            allowMinimize: false,   
            layout: new qx.ui.layout.Canvas()
        });       
        this.center();
        this.initComponent();
    },
   
    members :
    {       
        initComponent : function()
        {   
            var tableModel = new qx.ui.table.model.Simple();
            tableModel.setColumns([ "ID", "A number dsfsdfolsdf sdfoldsfds fsdfsdofsd fds fsdkfsdnfs dfdsf", "A date", "Boolean" ]);
            tableModel.setData(this.createRandomRows(1000));
           
            // make second column editable
            tableModel.setColumnEditable(1, true);
           
            // table
            var table = new qx.ui.table.Table(tableModel).set({
              decorator: null
            });
            this.add(table);
           
            var tcm = table.getTableColumnModel();
           
            // Display a checkbox in column 3
            tcm.setDataCellRenderer(3, new qx.ui.table.cellrenderer.Boolean());
           
            // use a different header renderer
           
            table.setHeaderCellHeight(50);
            tcm.setHeaderCellRenderer(1, new ga.sgop.common.models.headerRenderer());
            tcm.setHeaderCellRenderer(3, new ga.sgop.common.models.headerRenderer());
        },
       
        createRandomRows: function(rowCount) {
          var rowData = [];
          var now = new Date().getTime();
          var dateRange = 400 * 24 * 60 * 60 * 1000; // 400 days
          var nextId = 0;
          for (var row = 0; row < rowCount; row++) {
            var date = new Date(now + Math.random() * dateRange - dateRange / 2);
            rowData.push([ nextId++, Math.random() * 10000, date, (Math.random() > 0.5) ]);
          }
          return rowData;
        }
    }       
       
});

Please, can someone tell me what is wrong??



------------------------------------------------------------------------------
October Webinars: Code for Performance
Free Intel webinars can help you accelerate application performance.
Explore tips for MPI, OpenMP, advanced profiling, and more. Get the most from 
the latest Intel processors and coprocessors. See abstracts and register >
http://pubads.g.doubleclick.net/gampad/clk?id=60135031&iu=/4140/ostg.clktrk


_______________________________________________
qooxdoo-devel mailing list
[hidden email]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel


------------------------------------------------------------------------------
October Webinars: Code for Performance
Free Intel webinars can help you accelerate application performance.
Explore tips for MPI, OpenMP, advanced profiling, and more. Get the most from
the latest Intel processors and coprocessors. See abstracts and register >
http://pubads.g.doubleclick.net/gampad/clk?id=60135031&iu=/4140/ostg.clktrk
_______________________________________________
qooxdoo-devel mailing list
[hidden email]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel