Skip to content

Instantly share code, notes, and snippets.

@frehunter

frehunter/basic.html

Last active August 29, 2015 14:18
Show Gist options
  • Save frehunter/cdaa1622e2b1d0350f48 to your computer and use it in GitHub Desktop.
Save frehunter/cdaa1622e2b1d0350f48 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
basic.html
<html>
<head>
<meta charset="utf-8">
<title>Getting Started With kGrid Example</title>
<link rel="stylesheet" type="text/css" href="./assets/css/listcontrol.css">
<script type="text/javascript" src="./lib/jquery/jquery.js"></script>
<script type="text/javascript" src="./lib/jquery-ui/jquery-ui.js"></script>
<script type="text/javascript" src="./lib/js/listcontrol.js"></script>
<script type="text/javascript" src="./demo/basic.js"></script>
</head>
<body>
<div id="basic">
</div>
</body>
</html>
Raw
basic.js
$(function () {
var root = $('#basic');
var listControlElement = $('<div style="position: relative;"></div>');
root.append(listControlElement);
listControlObject = new Microsoft.Office.Controls.ListControl(listControlElement[0]);
listControlObject.width(548);
listControlObject.height(398);
listControlObject.addColumns([
{ data: 'No.', field: 'no', table: { width: 100 }, },
{ data: 'Name', field: 'name', table: { width: 100 }, },
{ data: 'Distance from Sun (AU)', field: 'distance', table: { width: 200 }, }]);
data = [
{ no: 1, name: 'Mercury', distance: 0.4 },
{ no: 2, name: 'Venus', distance: 0.7 },
{ no: 3, name: 'Earth', distance: 1 },
{ no: 4, name: 'Mars', distance: 1.5 },
{ no: 5, name: 'Jupiter', distance: 5.2 },
{ no: 6, name: 'Saturn', distance: 9.5 },
{ no: 7, name: 'Uranus', distance: 19.2 },
{ no: 8, name: 'Neptune', distance: 30.1 },
];
listControlObject.rows(data);
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment