[CLOSED]Grid RowSelectionModel Select All Rows command

[SMMJ_Dev]

Hello,

When I try to programmatically select all rows in the grid using a button, the style is not reflected on the grid. This is with the new release of ExtJS 4 and not the beta, fyi.

For example:

var grid = Ext.getCmp("grid");
grid.getSelectionModel().selectAll();

or

grid.getSelectionModel().select(grid.store.data, true, false);

or

grid.getSelectionModel().selectRange(0, 1, true);

So what I did was call the select and then style the rows myself.

Ext.Array.ForEach(Ext.getCmp("grid").query("tr.x-grid-row"),function(item,index,array){
    var row = Ext.get(item);
    if(!row.hasCls("x-grid-row-selected")){
        Ext.get(item).addCls("x-grid-row-selected");
    }
},this);

Is there something I am doing wrong, or is there a problem with select code? I also have to add in extra logic to the item click event on the grid so that after they select all and then click something on the grid, it will only show what is selected with the selection style.

[SMMJ_Dev]

I just saw this thread:
http://www.sencha.com/forum/showthre...elect-grid-row

I will try this when I get home tonight:

grid.getSelectionModel().selectRow(rowIndex);

[evant]

Have you got the selection model configured to use multiple selection?

Ext.require(['Ext.grid.*', 'Ext.data.*']);

Ext.onReady(function(){
    
    // sample static data for the store
    var myData = [['3m Co', 71.72, 0.02, 0.03, '9/1 12:00am'], ['Alcoa Inc', 29.01, 0.42, 1.47, '9/1 12:00am'], ['Altria Group Inc', 83.81, 0.28, 0.34, '9/1 12:00am'], ['American Express Company', 52.55, 0.01, 0.02, '9/1 12:00am'], ['American International Group, Inc.', 64.13, 0.31, 0.49, '9/1 12:00am'], ['AT&T Inc.', 31.61, -0.48, -1.54, '9/1 12:00am'], ['Boeing Co.', 75.43, 0.53, 0.71, '9/1 12:00am'], ['Caterpillar Inc.', 67.27, 0.92, 1.39, '9/1 12:00am'], ['Citigroup, Inc.', 49.37, 0.02, 0.04, '9/1 12:00am'], ['E.I. du Pont de Nemours and Company', 40.48, 0.51, 1.28, '9/1 12:00am'], ['Exxon Mobil Corp', 68.1, -0.43, -0.64, '9/1 12:00am'], ['General Electric Company', 34.14, -0.08, -0.23, '9/1 12:00am'], ['General Motors Corporation', 30.27, 1.09, 3.74, '9/1 12:00am'], ['Hewlett-Packard Co.', 36.53, -0.03, -0.08, '9/1 12:00am'], ['Honeywell Intl Inc', 38.77, 0.05, 0.13, '9/1 12:00am'], ['Intel Corporation', 19.88, 0.31, 1.58, '9/1 12:00am'], ['International Business Machines', 81.41, 0.44, 0.54, '9/1 12:00am'], ['Johnson & Johnson', 64.72, 0.06, 0.09, '9/1 12:00am'], ['JP Morgan & Chase & Co', 45.73, 0.07, 0.15, '9/1 12:00am'], ['McDonald\'s Corporation', 36.76, 0.86, 2.40, '9/1 12:00am'], ['Merck & Co., Inc.', 40.96, 0.41, 1.01, '9/1 12:00am'], ['Microsoft Corporation', 25.84, 0.14, 0.54, '9/1 12:00am'], ['Pfizer Inc', 27.96, 0.4, 1.45, '9/1 12:00am'], ['The Coca-Cola Company', 45.07, 0.26, 0.58, '9/1 12:00am'], ['The Home Depot, Inc.', 34.64, 0.35, 1.02, '9/1 12:00am'], ['The Procter & Gamble Company', 61.91, 0.01, 0.02, '9/1 12:00am'], ['United Technologies Corporation', 63.26, 0.55, 0.88, '9/1 12:00am'], ['Verizon Communications', 35.57, 0.39, 1.11, '9/1 12:00am'], ['Wal-Mart Stores, Inc.', 45.45, 0.73, 1.63, '9/1 12:00am']];
    
    // create the data store
    var store = Ext.create('Ext.data.ArrayStore', {
        fields: [{
            name: 'company'
        }, {
            name: 'price',
            type: 'float'
        }, {
            name: 'change',
            type: 'float'
        }, {
            name: 'pctChange',
            type: 'float'
        }, {
            name: 'lastChange',
            type: 'date',
            dateFormat: 'n/j h:ia'
        }],
        data: myData
    });
    
    // create the Grid
    var grid = Ext.create('Ext.grid.Panel', {
        store: store,
        columns: [{
            text: 'Company',
            flex: 1,
            sortable: false,
            dataIndex: 'company'
        }],
        height: 350,
        width: 600,
        renderTo: document.body,
        selModel: {
            mode: 'MULTI'
        },
        viewConfig: {
            stripeRows: true
        }
    });
    
    setTimeout(function(){
        grid.getSelectionModel().selectAll();
    }, 1000);
});

[SMMJ_Dev]

Thank you evant, I don't think it was. I am going to check that out.

[SMMJ_Dev]

Thank you so much!! That did it!

selModel: {
    mode: 'MULTI'
}

I was currently working on my migration over from Ext 3 to 4, and that was one of the things holding me back. Thank you again!

[venu.parva]

Here is my syntax:

My webpage HTML source:
<div id="ext-gen43" class="x-grid-body" style="height: 71px;"><table cellspacing="0" cellpadding="0" border="0">
<tbody>
<tr class="x-grid-row x-grid-row-selected ">

<td id="ext-gen307" class="x-grid-col x-grid-td-0 x-grid-cell-0-0 " tabindex="0">

<div class="x-grid-col-0 x-grid-cell-inner">
<div class="x-grid-cell-text" unselectable="on">JOHN</div>



</div>
Once I am trying to print the value of JOHN in the above code,my below code is working using selenium




sel.get_text("//div[contains(@id,'ext-gen') and contains(@class,'x-grid-body')]/table/tbody/tr["+ str(n) +"]/td[1]/div/div") => printing JOHN successfully.

But In order to select the above row using sel.click() command is failing.

sel.click("//div[contains(@id,'ext-gen') and contains(@class,'x-grid-body')]/table/tbody/tr["+ str(n) +"]/td[1]/div/div")=>Failed to select the x-grid row containing text "JOHN"

Here ,the "id=ext-gen43" is the x-grid-body-id always constant everytime,but the second id <td id="ext-gen307" > is dynamically generated after the manual click performed in that row.

In addition to these,initially the <tr class="x-grid-row x-grid-row-selected "> table row class value was like this <tr class="x-grid-row"> but after row selection it becomes like this <tr class="x-grid-row x-grid-row-selected "> and also dynamic id is generated for that row <td id="ext-gen307" > .

As it is x-grid property,I tried to implement it using the below syntax,

Selenium code:

valueOfGridScript = 'var grid = Ext.getCmp("ext-gen43"); grid.getSelectionModel().selectAll();' => To select all rows
valueOfGridScript = 'var grid = Ext.getCmp("ext-gen43"); grid.getSelectionModel().selectRow(1);' => To select first row
print "printing value.........."
print sel.run_script("valueOfGridScript")
print sel.get_eval("this.browserbot.getUserWindow().cellValue")
print "printing value end.........."

But still the row is not selected after the above Java script(which including Ext.grid code).
is executed and the output value is printed like this.

printing value..........
None
null
printing value end..........

Could any body please help me to resolve the above issue regarding grid-row selection.
Please reply here and also forward Your answer to venu.parva@gmail.com

Thanks in Advance.

Venu