jQuery Sample

Parent Previous Next

<!doctype html>

<html lang="en" ng-app="myApp">

<head>

 <meta charset="utf-8">

 <title>Simple</title>

 

       <!--These are jquery and plugins that we use from jquery-->

   <script type="text/javascript" src="http://htmltreegrid.com/demo/external/js/adapters/jquery/jquery-1.8.2.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/external/js/adapters/jquery/jquery-ui-1.9.1.custom.min.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/external/js/adapters/jquery/jquery.maskedinput-1.3.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/external/js/adapters/jquery/jquery.watermarkinput.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/external/js/adapters/jquery/jquery.ui.menu.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/external/js/adapters/jquery/jquery.toaster.js"></script>

       <!--End-->

   

       <!--These are specific to htmltreegrid-->

   <script type="text/javascript" src="http://htmltreegrid.com/demo/minified-compiled-jquery.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/examples/js/Configuration.js"></script>

   <script type="text/javascript" src="http://htmltreegrid.com/demo/themes.js"></script>

       <!--End-->

       <!--css imports-->

   <link rel="stylesheet" href="http://htmltreegrid.com/demo/flexicious/css/flexicious.css" type="text/css"/>

   <link rel="stylesheet" href="http://htmltreegrid.com/demo/external/css/adapter/jquery/jquery-ui-1.9.1.custom.min.css" type="text/css"/>

   <!--End-->

       

 <script type="text/javascript">

       $(document).ready(function(){

           var grid = new flexiciousNmsp.FlexDataGrid(document.getElementById("gridContainer"),

                   {

                       dataProvider: [

                                                       { "id": "5001", "type": "None" },

                                                       { "id": "5002", "type": "Glazed" },

                                                       { "id": "5005", "type": "Sugar" },

                                                       { "id": "5007", "type": "Powdered Sugar" },

                                                       { "id": "5006", "type": "Chocolate with Sprinkles" },

                                                       { "id": "5003", "type": "Chocolate" },

                                                       { "id": "5004", "type": "Maple" }

                                               ]

                   });

       });

   </script>

</head>

<body>

   <div id="gridContainer" style="height: 400px;width: 100%;">

   </div>

</body>

</html>