Question

i’m using Dojo 1.6 and trying to update an Html-Store with new data using Ajax. The store is connected to a DataGrid and when displaying the data for the first time it works. But when i’m updating the store, the rows in the datagrid vanish (the headers are still there).

The interesting thing is that it works in Firefox 5 and GoogleChrome 12 but not in InternetExplorer 9 and Opera 11.5

//the Ajax call just the data in this table
<table id="dataTableId" style="display: none;">
//... the data here ...
</table>

<span dojoType="dojox.data.HtmlStore" dataId="dataTableId" trimWhitespace="true" jsId="storeId" />
<table dojoType="dojox.grid.DataGrid" store="storeId" query="{}" jsId="grid" selectionMode="single"> </table>

the JS-update function:

function updateStore(){
var newStore = new dojox.data.HtmlStore({dataId: 'dataTableId'});
grid.setStore(newStore);

//these 2 don't have any effect:
newStore.update();
newStore.fetch();
}

I also checked the Html-Code in Firefox and in InternetExplorer after updating the grid:

InternetExplorer-HtmlCodeView

<div class="dojoxGridScrollbox" role="presentation" style="height: 585px;" dojoAttachPoint="scrollboxNode">
    <div class="dojoxGridContent" role="presentation" style="width: 535px; height: 1px;" hideFocus="hidefocus" dojoAttachPoint="contentNode" />
    // in the above div all the data-rows should be (see the Firebug output below)
</div>

Firefox-Firebug

<div role="presentation" dojoattachpoint="scrollboxNode" class="dojoxGridScrollbox" style="height: 270px;">
    <div role="presentation" hidefocus="hidefocus" dojoattachpoint="contentNode" class="dojoxGridContent" style="height: 168px; width: 535px;">
            //... all the data-rows here ... 
    </div>
</div>

Has anyone of you an idea what i can try or what i’m doing wrong? Thanks in advance!

Answer 1

The guys from the dojo-toolkit support forum found the solution to my problem [1].

The problem was that I changed the whole table and not only the tbody part.

complete answer:

How are you modifying the table? IE requires any row insertions be done to the node, not the node. IE also creates a tbody node for you if your markup didn’t have one. Trying to append a a row to in IE will fail, it will never render/be processed by IE. It’s likely opera expects the same. Check how you are modifying the table and always update it from its tag. FireFox and Chrome are more lenient here.

Sincerely,
— Jared Jurkiewicz

[1] http://dojo-toolkit.33424.n3.nabble.com/Dojo-1-6-Updating-DataGrid-HtmlStore-doesn-t-display-data-in-IE-and-Opera-td3224759.html