본문 바로가기

Grid

Grid row별 Combobox 필터링 https://fiddle.sencha.comSencha Fiddle에 복사해서 붙여넣기 하면 됩니다.Ext.application({ name : 'Fiddle', launch : function() { Ext.create('Ext.grid.Panel', { renderTo: Ext.getBody(), store: Ext.create('Ext.data.Store', { fields: ['combo', 'val'], data: [{combo: 1, val: 1},{combo: 2, val: 2}] }), columns: [{ text: 'ComboColumn', dataIndex: 'combo', flex: 1, editor: { xtype: 'combobox', displayField: 'name', v.. 더보기
Grid group Header(colspan) Flex 문제 Grid에서 Group header(colspan)을 사용하게 되면 한가지 문제점이 발생한다. { Ext.application({ name: 'Fiddle', launch: function () { Ext.create('Ext.data.Store', { storeId: 'simpsonsStore', fields: ['name', 'email', 'phone', 'type'], data: { 'items': [ { 'name': 'Lisa', "email": "lisa@simpsons.com", "phone": "555-111-1224", "type": "Child" }, { 'name': 'Bart', "email": "bart@simpsons.com", "phone": "555-222-1234", "t.. 더보기
EXTJS 그리드 행 높이 변경 아래와 같이 CSS에 클래스를 추가합니다. .my-grid-row-class{height:40px;vertical-align:middle;} Grid Config값에 getRowClass를 사용하여 CSS에 추가한 클래스를 리턴하면 각 행별로 해당 클래스가 추가 됩니다. viewConfig: { getRowClass: function(record, rowIndex, rowParams, store){ return 'my-grid-row-class'; } }, 더보기
그리드 칼럼에 HTML 태그 내용 보여주기 EXTJS 그리드 칼럼에 HTML 태그 내용을 입력하면 입력한 태그 내용대로 화면에 표시가 됩니다.이런경우 태그값을 그대로 보여주고 싶다면해당 칼럼의 config 값에 renderer: 'htmlEncode' 를 추가하면 태그값을 그대로 표시해 줍니다. 더보기