Seeni,
I have a sample that should reproduce the problem. The key difference is that I am loading my grid after the grid is initially created. Please see the attached code (which I created in JS Playground using the latest Syncfusion library). Note that after the grid is loaded that if the form is resized the grid will resize vertically to the point that no rows are visible. This makes the grid unusable if there is a lot of content below the grid as the grid will always be in the state where no rows are visible.
Regards, Jeff
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Essential Studio for JavaScript">
<meta name="author" content="Syncfusion">
<title>
Untitled
</title>
<!-- Essential Studio for JavaScript theme reference -->
<link rel="stylesheet" rel='nofollow' href="http://cdn.syncfusion.com/14.2.0.28/js/web/flat-azure/ej.web.all.min.css" />
<!-- Essential Studio for JavaScript script references -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js">
</script>
<script src="http://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js">
</script>
<script src="http://cdn.syncfusion.com/js/assets/external/jquery.globalize.min.js">
</script>
<script src="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js">
</script>
<script src="http://cdn.syncfusion.com/14.2.0.28/js/web/ej.web.all.min.js">
</script>
<!--Add custom scripts here -->
</head>
<body>
<div id="Grid">
</div>
</body>
<script type = 'text/javascript' >
var dataManager = ej.DataManager({
url: "http://mvc.syncfusion.com/Services/Northwnd.svc/Orders",
crossDomain:true
});
function loadGrid()
{
var grid = $("#Grid").ejGrid({
dataSource: dataManager
});
}
$(function ($) {
$("#Grid").ejGrid({
"allowPaging" : true,
"allowTextWrap" : true,
"allowSorting" : true,
"allowFiltering" : true,
"minWidth" : 250,
"allowResizeToFit" : true,
"isResponsive" : true,
"pageSettings" : {
"pageSize" : 10
},
"filterSettings" : {
"filterType" : "Excel",
"filteredColumns" : []
},
"scrollSettings" : {
"height" : "auto"
},
"columns" : [
{ "field" : "OrderID" },
{ "field" : "ShipCity" }
],
// dataSource: dataManager
});
setTimeout(loadGrid,500);
});
</script>
</html>
