Dojox Datagrid contains data, but shows up as empty

Posted by Vivek on Stack Overflow See other posts from Stack Overflow or by Vivek
Published on 2010-02-26T15:24:41Z Indexed on 2010/05/07 20:28 UTC
Read the original article Hit count: 329

Filed under:
|
|
|
|

I'd really appreciate any help on this. There is this Dojox Datagrid that I'm creating programatically and supplying JSON data. As of now, I'm creating this data within JavaScript itself. Please refer to the below code sample.

var upgradeStageStructure =[{
    cells:[
      {
        field: "stage",
        name: "Stage",
        width: "50%",
        styles: 'text-align: left;'
      },
      {
        field:"status",
        name: "Status",
        width: "50%",
        styles: 'text-align: left;'
      }
    ]
    }];

    var upgradeStageData =
      [
        {id:1, stage: "Preparation", status: "Complete"},
        {id:2, stage: "Formatting", status: "Complete"},
        {id:3, stage: "OS Installation", status: "Complete"},
        {id:4, stage: "OS Post-Installation", status: "In Progress"},
        {id:5, stage: "Application Installation", status: "Not Started"},
        {id:6, stage: "Application Post-Installation", status: "Not Started"}
      ];
    var stagestore = new dojo.data.ItemFileReadStore({data:{identifier:"id", items: upgradeStageData}});
var upgradeStatusGrid = new dojox.grid.DataGrid({
        autoHeight: true,
        style: "width:400px;padding:0em;margin:0em;",
        store: stagestore,
        clientSort: false,
        rowSelector: '20px',
        structure: upgradeStageStructure,
        columnReordering: false,
        selectable: false,
        singleClickEdit: false,
        selectionMode: 'none',
        loadingMessage: 'Loading Upgrade Stages',
        noDataMessage:'There is no data',
        errorMessage: 'Failed to load Upgrade Status'
    });

    dojo.byId('progressIndicator').innerHTML='';
    dojo.byId('progressIndicator').appendChild(upgradeStatusGrid.domNode);
    upgradeStatusGrid.startup();

The problem is that I am not seeing anything within the grid upon display (no headers, no data). But I know for sure that the data in the grid does exist and the grid is properly initialized, because I called alert (grid.domNode.innerHTML);. The resultant HTML that is thrown up does show a table containing header rows and the above data.

This link contains an image which illustrates what I'm seeing when I display the page. (Can't post images since my account is new here)

As you may notice, there are 6 rows for 6 pieces of data I have created but the grid is a mess. Please help out if you think you know what could be going wrong.

Thanks in advance, Viv

© Stack Overflow or respective owner

Related posts about dojo

Related posts about dijit