Skip to content

Instantly share code, notes, and snippets.

Sencha ViewModels tips and considerations.

  1. Always destroy your bindings in the destroy method of your view. In the example below, the grid is a child of a parent view which has a ViewModel. But if the child is removed from the parent the binding will still be called and can lead to unexpected surprises. So you could destroy them manually, or automatically by adding a ViewModel to the view

    Ext.define('MyApp.view.MyGridTab', {
        extend: 'Ext.grid.Panel',
        xtype: 'mygrid',
        columns: [],
        beforeRender: function () {
@vadimpopa
vadimpopa / instructions.txt
Last active February 21, 2019 09:19
How to concat files with CMD then transpile and minify with BabelJs
// Bellow instructions how to run a build with BabelJs. After following them, just run in CLI: `sencha app build` or `npm run build`
// 1. In app.json
"production": {
"output": {
"framework": {
"enable":true //This enables split mode, app code will be splitted in 2 files: app.js and framework.js
}
}
},
Ext.define('MyApp.view.search.results.RowDetails', {
extend: 'Ext.container.Container',
xtype: 'search.results.rowdetails',
requires: [
'Acclaim.mixin.Tooltip',
'Acclaim.util.Renderers',
'Acclaim.util.Collections',
'Acclaim.view.document.field.Assignee',
Ext.define('MyApp.view.search.results.RowWidget', {
extend: 'Ext.grid.plugin.RowWidget',
alias: 'plugin.search.results.rowwidget',
bindView: function(view) {
this.callParent(arguments);
this.viewListeners = view.on({
scope: this,
destroyable: true,
@vadimpopa
vadimpopa / SenchaExtConfig.md
Last active July 4, 2016 14:51
Sencha Ext.Config

In a previous post (http://moduscreate.com/a-dive-into-the-sencha-class-config-system/) Stan explained the foundation of Sencha Config System and how the getters and setters work. In this post I'm going to explain the new Ext.Config.configs which have been added in versions 5.0 and 5.5, which you can find here http://docs.sencha.com/extjs/6.0.2-classic/Ext.Config.html

  1. Ext.Config.cached

According to Sencha docs the cached config when set as true the config property will be stored on the class prototype once the first instance has had a chance to process the default value. To test that I've created a Fiddle: https://fiddle.sencha.com/#fiddle/1cpj.

```javascript
@vadimpopa
vadimpopa / customDisplayField.js
Last active May 24, 2016 17:59
Bind + Renderer = Quick&Easy custom Ext.form.field.Display
// Custom display field: D01H7/74; D01H9/04
xtype: 'displayfield',
fieldLabel: 'Custom display field',
bind: {
value: '{fooArray}'
},
customFieldTpl: new Ext.XTemplate(
'<tpl for="." between=";&nbsp;">',
'<span class="search-field-link" data-value="{xindex}"' ,
@vadimpopa
vadimpopa / AngularExt6.js
Last active May 9, 2016 06:16
Angular2 component in ExtJs6
Ext.define('MyApp.modules.Angular', {
singleton: true,
dependeciesLoaded: false,
showComponent: function() {
var count = 5;
if (!this.dependeciesLoaded) {
var onLoad = function () {
@vadimpopa
vadimpopa / kbSelect.js
Created February 9, 2015 16:32
angular keyboard select
/* Usage:
* <div kb-select ng-model="items.selectedItem">
* <div class="just-a-tag-with-a-class"></div>
* <my-data-row ng-repeat="item in items" entity="item"></my-data-row>
* </div>
*/
function kbSelect() {
return {
restrict: 'EA',