<table id="dg" style="width:auto;height:400px"
    url="get.php"
    title="List Master"
    singleSelect="true" fitColumns="true">
    <thead>
        <tr>
            <th field="sp_id" width="10" align="center">ID</th>
            <th field="sp_name" width="100">Name</th>
            <th field="st_symbol" width="20" align="center">Symbol</th>
            <th field="sp_volume" width="30" align="right">Volume <br /> Satuan</th>
            <th field="price" width="50" align="right">Price <br /> (Rp)</th>
            <th field="sp_status" width="40">Status</th>
		
        </tr>
    </thead>
</table>
<script type="text/javascript">
        $(function(){
            $('#dg').datagrid({
                view: detailview,
                detailFormatter:function(index,row){
                    return '<div style="padding:2px"><table class="ddv"></table></div>';
                },
                onExpandRow: function(index,row){
                    var ddv = $(this).datagrid('getRowDetail',index).find('table.ddv');
                    ddv.datagrid({
                        url:'rincian.php?sp_id='+row.sp_id,
                        fitColumns:true,
                        singleSelect:true,
                        rownumbers:true,
                        loadMsg:'',
                        height:'auto',
                        columns:[[
                            {field:'sd_name',title:'Resources Name',width:180},
                            {field:'st_symbol',title:'Symbol',width:50,align:'center'},
                            {field:'r_koefisien',title:'Koefisien',width:70,align:'right'},
                            {field:'t_price',title:'Supplier Price',width:100,align:'right'},
                            {field:'s_name',title:'Supplier',width:200}
                        ]],
                        onResize:function(){
                            $('#dg').datagrid('fixDetailRowHeight',index);
                        },
                        onLoadSuccess:function(){
                            setTimeout(function(){
                                $('#dg').datagrid('fixDetailRowHeight',index);
                            },0);
                        }
                    });
                    $('#dg').datagrid('fixDetailRowHeight',index);
                }
            });
        });	
</script>