ExtJS ComponentQuery and Dynamic content

0
votes

I have a layout with multiple grids, and they all use RowEditing plugin. I am trying to use Ext.ComponentQuery.query to get access to the embedded RowEditor buttons on specific grids, but am unable to figure out how to properly traverse things. I wonder if it has to do with the RowEditor and buttons being added dynamically - though I cannot find anything to confirm that is expected or not.

Edited to Add jsfiddle http://jsfiddle.net/ttubbs/eadfpxao/

Once the RowEditing has been activated in each grid (double click a row in each one), running the following in the console produces indicated results...

Ext.ComponentQuery.query("roweditorbuttons") // two results
Ext.ComponentQuery.query("roweditorbuttons > #update") // two results
Ext.ComponentQuery.query("#grid1 > roweditorbuttons") // no results
Ext.ComponentQuery.query("#grid1 >  #update") // no results

Ext.ComponentQuery.query("roweditorbuttons > button[text=Update]") // two results

I need to be able to do something like the following, but the queries don't work:

Ext.ComponentQuery.query("#grid2 > #update") // give me the update button in #grid2
Ext.ComponentQuery.query("#update").up().itemId === "grid1" // determine which grid my button is in

The questions are:

  • Given a grid (#grid1[1]), how can I get access to the row editor buttons?
  • Given a button (#update[0]), how can I get access to its parent grid?
2
javascriptextjs

2 Answers

0
votes

Hi try with this selection

Ext.ComponentQuery.query('roweditorbuttons > button[text=Update]')[0]

please find the screenshot.enter image description here

0
votes

First of all, you should change your itemId to id in your grids in this example. "itemId" doesnt matter in your example. Lets say your grid has id=grid1, and your roweditor plugins have pluginId=roweditor:

var plugin = Ext.getCmp("grid1").getPlugin("roweditor");
// you can get the update button like this
var updateBtn = plugin.editor.floatingButtons.down("button");
// you can get the grid from the plugin as well
var grid = plugin.grid;