Please use the treegrid instead, try this code:
<script type="text/javascript">
var data = [{
itemid:'Parent Record1',hole1:'4',state:'closed',
children:[{
itemid:'Child',hole1:'4',hole2:'5',hole3:'4',hole4:'2'
}]
},{
itemid:'Parent Record2',hole1:'5',hole2:'6',hole3:'4',hole4:'6'
}];
</script>
<table id="tt" class="easyui-treegrid" data-options="idField:'itemid',treeField:'itemid',data:data" style="width:100%;height:550px;">
<thead frozen="true">
<tr>
<th field="itemid" width="200">Test 2</th>
<th field="productid" width="60" align="center">Yards</th>
</tr>
</thead>
<thead>
<tr>
<th field="hole1" width="60" align="center">333</th>
<th field="hole2" width="60" align="center">481</th>
<th field="hole3" width="60" align="center">360</th>
<th field="hole4" width="60" align="center">146</th>
<th field="hole5" width="60" align="center">380</th>
</tr>
</thead>
</table>