Сетка Плагин На ExtJS


Код ниже-это плагин я писал для внутр.сетки.GridPanel, который в основном позволяет вам иметь немного больше контроля над тем, как строки в полоску в сетке. По умолчанию можно использовать только каждую вторую строку в альтернативный цвет. С помощью этого плагина вы к примеру 5 в основной цвет, 5 в другой и так далее.

Что беспокоит меня об этом, заключается в том, что это в принципе 100+ строк, копируемых из доб.сетки.GridView в не более 10 строк моих изменений. Я хотел бы знать, если есть способ сделать это в более элегантный способ.

Моя вторая проблема-это плагин для внутр.сетки.GridPanel, но он на самом деле изменяет базовый внутр.сетки.Управления GridView. Насколько я знаю, нет никакого способа, чтобы прикрепить плагин к GridView в текущих архитектура, но, возможно, ты знаешь дорогу.

Юридическая информация: кодекс во многом опирается на код ExtJS исходный код, и как таковой, он выпущен под ГНУ лицензия GPL v3 лицензии

MyNamespace.grid.plugins.RowStriper = Ext.extend(Object, {
  constructor : function(config) {
    config = config || {};
    Ext.apply(this, config);
  },
  init : function(parent) {
        if (parent instanceof Ext.grid.GridPanel) {
            this.parent = parent;
            this.parent.stripeInterval = this.stripeInterval;
            parent.on('destroy', this.onDestroy, this);
            Ext.apply(parent.getView(), this.parentViewOverrides);
        }
  },
  onDestroy : Ext.emptyFn,
    parentViewOverrides : {
        doRender : function(columns, records, store, startRow, colCount, stripe) {
      var templates    = this.templates,
          cellTemplate = templates.cell,
          rowTemplate  = templates.row,
          last         = colCount - 1;

      var tstyle = 'width:' + this.getTotalWidth() + ';';

      // buffers
      var rowBuffer = [],
          colBuffer = [],
          rowParams = {tstyle: tstyle},
          meta      = {},
          column,
          record;

      //build up each row's HTML
      for (var j = 0, len = records.length; j < len; j++) {
        record    = records[j];
        colBuffer = [];

        var rowIndex = j + startRow;

        //build up each column's HTML
        for (var i = 0; i < colCount; i++) {
          column = columns[i];

          meta.id    = column.id;
          meta.css   = i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
          meta.attr  = meta.cellAttr = '';
          meta.style = column.style;
          meta.value = column.renderer.call(column.scope, record.data[column.name], meta, record, rowIndex, i, store);

                    if (Ext.isEmpty(meta.value)) {
            meta.value = '&#160;';
          }

          if (this.markDirty && record.dirty && Ext.isDefined(record.modified[column.name])) {
            meta.css += ' x-grid3-dirty-cell';
          }

          colBuffer[colBuffer.length] = cellTemplate.apply(meta);
        }

        //set up row striping and row dirtiness CSS classes
        var alt = [];

                if (stripe && (rowIndex % (this.grid.stripeInterval * 2)) > (this.grid.stripeInterval - 1)) {
          alt[0] = 'x-grid3-row-alt';
        }

        if (record.dirty) {
          alt[1] = ' x-grid3-dirty-row';
        }

        rowParams.cols = colCount;

        if (this.getRowClass) {
          alt[2] = this.getRowClass(record, rowIndex, rowParams, store);
        }

        rowParams.alt   = alt.join(' ');
        rowParams.cells = colBuffer.join('');

        rowBuffer[rowBuffer.length] = rowTemplate.apply(rowParams);
      }

      return rowBuffer.join('');
    },
        processRows : function(startRow, skipStripe) {
        if (!this.ds || this.ds.getCount() < 1) {
              return;
      }

      var rows = this.getRows(),
                    len  = rows.length,
                    i, r;

      skipStripe = skipStripe || !this.grid.stripeRows;
            var stripeInterval = this.grid.stripeInterval || 1;
      startRow   = startRow   || 0;

      for (i = 0; i<len; i++) {
                r = rows[i];
                if (r) {
                    r.rowIndex = i;
          if (!skipStripe) {
                        r.className = r.className.replace(this.rowClsRe, ' ');
            if ((i % (stripeInterval * 2)) > (stripeInterval - 1)){
                            r.className += ' x-grid3-row-alt';
            }
          }
        }
      }

      // add first/last-row classes
      if (startRow === 0) {
                Ext.fly(rows[0]).addClass(this.firstRowCls);
      }

      Ext.fly(rows[rows.length - 1]).addClass(this.lastRowCls);
        }
  }
});


1976
12
задан 23 января 2011 в 07:01 Источник Поделиться
Комментарии