PDA

View Full Version : Component making - howto



michall
12 Dec 2011, 11:55 AM
Hello,

I'm looking for some kind of know-how information how to create component. In my case I have a custom grid renderer, it's responsible for generating html. In nearest future I would like to have ability to make this dragable, also access to model object (related to cell/grid column), some html mangament in one place (component, plugin?), which option is best? Some hints, ideas and examples are extremely welcome.

mitchellsimoens
12 Dec 2011, 12:38 PM
If you want the grid and all the goodies that comes along with it... use a grid. You also have Ext.view.View (DataView) that can use a store and render HTML just no controls to click to sort and such.

michall
12 Dec 2011, 1:02 PM
I was little unclear sorry, I already have a Ext.grid.Panel and custom cell renderer. Currently renderer generate html to paint in grid cell, but I'm thinking of some component/plugin (?) to manage that and have a chance to bind events like click etc on that generated html and be able to drag and drop this later. Thats why I'm looking for some more knowledge.

michall
14 Dec 2011, 2:17 PM
In short, the record rendered in the cell has many elements in hasMany relationships, my custom render handle the rendering this elements, but I need to handle dbclick on this elements and other operations like opening edit window for record. Could you give me some snippets how to render data using "dataview" into grid cell and attache event handling?

abcdef
14 Dec 2011, 3:54 PM
In short, the record rendered in the cell has many elements in hasMany relationships, my custom render handle the rendering this elements, but I need to handle dbclick on this elements and other operations like opening edit window for record. Could you give me some snippets how to render data using "dataview" into grid cell and attache event handling?

If I understand you correctly, this might be of some help:



var gridElement = yourGrid.getEl();
gridElement.on('click', function(event) {
// Execute whatever function you need to
}, gridElement, {
delegate: '.classname-of-the-element-you-need-the-event-attached-to'
});


Hope that helps.

michall
15 Dec 2011, 1:37 AM
Thanks abcdef for Your reply, funny but I have done that just before You post this ;-)