Hi,
I have a datagrid in a panel and i want to resize the panel when a new row is added to the datagrid by the end user.
How do i go about doing this?
HTML
<div id="sectionA" class="easyui-panel" title="Section A" style="padding:5px;height:250px;">
<table id="dg"
toolbar="#toolbar"
pagination="false"
pageList="[10,20,30,40,50,100]"
singleSelect="true"
fitColumns="false"
fit="true"
nowrap="true"
rownumbers="false"
autoSave="true"
idField="id">
</table>
<div id="toolbar">
<a id="btnAdd" href="#" class="easyui-linkbutton" iconCls="icon-add" onclick="fncAddSave(1)">Add</a>
<a id="btnSave" href="#" class="easyui-linkbutton" iconCls="icon-save" onclick="fncAddSave(2)">Save</a>
</div>
JS
function fncAddSave($addsave){
$('#sectionA').panel('resize',{
//height: 600
});
$('#dg').datagrid('resize',{
//height: 600
});
if($addsave == 1){
$('#dg').edatagrid('addRow',{
index: 0,
row:{
randNBR:randNBR
}
});
$('#btnAdd').hide();
$('#btnSave').show();
} else if($addsave == 2){
$('#dg').edatagrid('saveRow');
$('#btnAdd').show();
$('#btnSave').hide();
}
};