1 files changed, 33 insertions, 0 deletions
diff --git a/demos/tizen-winsets/widgets/grid/virtualgrid-auto.html b/demos/tizen-winsets/widgets/grid/virtualgrid-auto.html
new file mode 100755
index 00000000..ae2b4703
--- /dev/null
+++ b/demos/tizen-winsets/widgets/grid/virtualgrid-auto.html
@@ -0,0 +1,33 @@
+<div id="virtualgrid_grid_page" data-role="page" class="virtualgrid_test_demo_page">
+	<div data-role="header" data-position="fixed">
+		<h1>Virtual Grid - Auto</h1>
+	</div>
+	<div data-role="content" data-scroll="none">
+		<script id="tizen-demo-namecard" type="text/x-jquery-tmpl">
+			<div class="ui-demo-rotation-namecard">
+			<div class="ui-demo-namecard-pic">
+			<img class="ui-demo-namecard-pic-img" src="${TEAM_LOGO}"  />
+			</div>
+			<div class="ui-demo-namecard-contents">
+			<span class="name ui-li-text-main">${NAME}</span>
+			</div>
+			</div>
+		</script>
+		<div id="virtualgrid-demo" data-role="virtualgrid"  data-itemcount="auto" data-direction="y" data-rotation="false" data-template="tizen-demo-namecard">
+		</div>
+	</div>
+	<script>
+		$( ".virtualgrid_test_demo_page" ).one( "pagecreate", function() {
+			$.getScript( "./js/virtualgrid-db-demo.js", function( data, textStatus ) {
+				$( ":jqmData(role='virtualgrid')" ).virtualgrid( "create", {
+					itemData: function ( idx ) {
+						return JSON_DATA[ idx ];
+					},
+					numItemData: JSON_DATA.length,
+					cacheItemData: function ( minIdx, maxIdx ) {
+					}
+				});
+			});
+		});
+	</script>
+</div>