Data not shown in slickgrid

Question

I'm working with slickgrid in my webpage, the problem I'm getting while using it that I'm unable to see the data in the grid. While when I try to get the data through grid object (i.e. grid.getData();) , I can get the whole data which I have previously set in the grid but don't know why its not showing up. May be I'm missing some thing.

following is my code for drawing the grid.

HTML code:

<div id="myGrid" width="100%"; height="500px"></div>

JS code:

drawBlotterForOrders : function(data){
    try{
        var columns = this.getBlotterColumns();
        var options = {
             enableCellNavigation: true,
            enableColumnReorder: false
        };

        var dataArray = [];
        dataArray = self.setDataInGrid(data);
        gridObj = new Slick.Grid("#myGrid" , dataArray , columns , options);
        console.log(gridObj.getData());//here I'm able to get the data
    }catch(exp){
    }
},

setDataInGrid : function(data){
    try{
        var dataArray = [];
        i++;
        dataArray[0] = {
            id : i,
            clOrdId : data.clOrdId,
            cumQty : data.cumQty,
            execId : data.execId,
            execType : data.execType,
            leavesQty : data.leavesQty,
            ordStatus : data.ordStatus,
            orderId : data.orderId,
            orderQty : data.orderQty,
            side : data.side,
            symbol : data.symbol
        };
        return dataArray;
    }catch(exp){
    }
},

getBlotterColumns : function(){
    var col = [
            {   id: 'id',
                name : 'id',
                field : 'id' 
            },{ 
                id: 'clOrdId',
                name : 'clOrdId',
                field : 'clOrdId' 
            },{
                id: 'cumQty',
                name : 'cumQty',
                field : 'cumQty'
            },{
                id: 'execId',
                name : 'execId',
                field : 'execId'
            },{
                id: 'execType',
                name : 'execType', 
                field : 'execType'
            },{
                id: 'leavesQty',
                name : 'leavesQty',
                field : 'leavesQty' 
            },{
                id: 'ordStatus',
                name : 'ordStatus',
                field : 'ordStatus'
            },{
                id: 'orderId',
                name : 'orderId',
                field : 'orderId'
            },{
                id: 'orderQty',
                name : 'orderQty',
                field : 'orderQty'
            },{
                id: 'side',
                name : 'side' ,
                field : 'side'
            },{
                id: 'symbol',
                name : 'symbol',
                field : 'symbol'
            }
        ];
    return col;
}

I'm unable to detect the mistake I'm making. I'll be really thankful for any help.

Answer 1

You forgot to render the grid I think, did you put a grid.render() ?