jQuery Grid Plugin - jqGrid

hello,

After 2 days of search this is how i add columns dynamically to jqgrid

function loadGrid() {
    var svcUrl = 'Services/Info.svc';
   
    $.ajax({
        type: "POST",
        url: svcUrl + "/GetInfo",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            var obj = response.GetInfoResult;
            var cnames = JSON.parse(obj.ColNames);
            var cmodel = JSON.parse(obj.ColModel);
 
            $("#tblInfo").empty().jqGrid({
                datatype: "local",
                height: 200,
                colNames: cnames,
                colModel: cmodel,
                width: 500,
                pager: "#pager",
                rowList: [10, 20, 30],
                rowNum: 10,
                emptyrecords: "No records to view",
                sortorder: "asc",
                viewrecords: true,
                loadtext: "Loading....",
                sortable: true
            });
 
            var mydata = JSON.parse(JSON.parse(obj.ColData).Row);
            for (dr in mydata) {
                $("#tblInfo").jqGrid('addRowData', dr, mydata[dr]);
            }
        },
        error: function (response)
        { alert(response.responseText); }
    });
    return false;
}

The data for ColNames, ColData and ColModel comes from WCF service.

Thanks,
Manju