jQuery Grid Plugin - jqGrid

Hey all.. trying to add a subgrid to my project but as soon as a add subGrid : true to my config the whole grid fails to load. it just gets stuck on the loading screen.

my grid json is below, If anyone could help me out with this i'd be really gratful. Thanks!

recipe_db = ({
       url:'json.php?db=recipes',
    datatype: 'json',
       colNames:['Name','Description'],
       colModel:[
           {name:'r_name',index:'r_name', width:150, editable:true, editoptions:{readonly:false}, sorttype:'int'},
           {name:'r_desc',index:'r_desc', width:600, sorttype:'asc', editable:true, editrules:{readonly:false}}
       ],
       rowNum:10,
       rowTotal: 50,
       rowList:[10,20,30],
       pager: '#prdb',
       sortname: 'id',
       loadonce: false,
    viewrecords: true,
    sortorder: 'desc',
    editurl: 'save.php?db=recipes',
    caption:'Recipe DB',
    hiddengrid: true,
    subGrid : true,
    subGridUrl: 'json.php?db=recipes',
    subGridModel: [{ name : ['Name','Qty','Unit'], width : [55,200,80] } ]
})