Skip to content

Instantly share code, notes, and snippets.

@kadzany
Created December 22, 2019 07:20
Show Gist options
  • Save kadzany/7a3fa0043973eb5fb02d349ed2d4c553 to your computer and use it in GitHub Desktop.
Save kadzany/7a3fa0043973eb5fb02d349ed2d4c553 to your computer and use it in GitHub Desktop.
TW_PROCUREMENT_16_JAN_2020
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://designer.igniteui.com/packages/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/themes/infragistics/infragistics.theme.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/structure/infragistics.css">
<!--
Update the Ignite UI script references to your licensed copies before deploying.
Ignite UI License: http://www.infragistics.com/legal/license/ultimate/
-->
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.min.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.core.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.lob.js"></script>
<!-- You may remove the datasources.js script if you are not using Designer sample data. -->
<script src="http://designer.igniteui.com/js/datasources.js"></script>
<script id="code">
$(document).ready(function () {
});
</script>
</head>
<body>
<div id="row1" class="row">
<div class="col-md-4">
</div>
<div class="col-md-4">
<h1 id="heading1">Login</h1>
<hr/>
<p id="text1">Username</p>
<input value="" id="input1" contenteditable="true"/>
<p id="text2">Password<br></p>
<input id="input2" contenteditable="true" type="password"/>
<hr/>
<button id="button1">Login</button>
</div>
<div class="col-md-4">
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://designer.igniteui.com/packages/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/themes/infragistics/infragistics.theme.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/structure/infragistics.css">
<!--
Update the Ignite UI script references to your licensed copies before deploying.
Ignite UI License: http://www.infragistics.com/legal/license/ultimate/
-->
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.min.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.core.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.lob.js"></script>
<!-- You may remove the datasources.js script if you are not using Designer sample data. -->
<script src="http://designer.igniteui.com/js/datasources.js"></script>
<script id="code">
$(document).ready(function () {
$("#grid1").igGrid({
dataSource: defaultGridData1,
width: "100%",
height: "450",
renderCheckboxes: true,
autoGenerateColumns: false,
columns: [
{
key: "active",
headerText: "Active",
dataType: "bool",
width: "7%"
},
{
key: "registered",
headerText: "Registered",
dataType: "date",
format: "d MMM yyyy",
width: "13%"
},
{
key: "name",
headerText: "Name",
width: "20%"
},
{
key: "company",
headerText: "Company",
width: "15%"
},
{
key: "phone",
headerText: "Phone",
width: "15%"
},
{
key: "email",
headerText: "Email",
template: "<a href='mailto:${email}'>${email}</a>",
width: "30%"
}
],
features: [
{
name: "Filtering",
language: "en"
},
{
name: "Paging",
showPageSizeDropDown: false,
language: "en"
},
{
name: "Sorting",
language: "en"
},
{
name: "Selection",
language: "en",
inherit: true
}
]
});
});
</script>
</head>
<body>
<div id="row1" class="row">
<div class="col-md-3">
<h3>Vendor</h3>
<ul id="list1">
<li>Vendor Category</li>
<li>Vendor Master</li>
</ul>
<h3>Category</h3>
<ul id="list1">
<li>Catalog Category</li>
<li>Catalog Unit of Measure</li>
<li>Catalog Currency</li>
<li>Catalog Master</li>
</ul>
</div>
<div class="col-md-9">
<h1 id="heading1">Vendor Category</h1>
<hr/>
<button id="button1">Add New Category</button>
<hr/>
<div id="grid1"></div>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://designer.igniteui.com/packages/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/themes/infragistics/infragistics.theme.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/structure/infragistics.css">
<!--
Update the Ignite UI script references to your licensed copies before deploying.
Ignite UI License: http://www.infragistics.com/legal/license/ultimate/
-->
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.min.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.core.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.lob.js"></script>
<!-- You may remove the datasources.js script if you are not using Designer sample data. -->
<script src="http://designer.igniteui.com/js/datasources.js"></script>
<script id="code">
$(document).ready(function () {
window.JSONPDataSource1 = new $.ig.JSONPDataSource({
dataSource: "https://jsonplaceholder.typicode.com/users/1/posts",
responseTotalRecCountKey: "responseTotalRecCountKey",
responseDataKey: "responseDataKey",
type: "json"
});
$("#grid1").igGrid({
dataSource: JSONPDataSource1,
jsonpRequest: true,
width: "100%",
height: "450",
renderCheckboxes: true,
autoGenerateColumns: false,
columns: [
{
key: "userId",
headerText: "UserId",
dataType: "number",
width: "7%"
},
{
key: "title",
headerText: "Post Title",
dataType: "string",
width: "13%"
},
{
key: "body",
headerText: "Post Body",
dataType: "string",
width: "80%"
}
],
features: [
{
name: "Filtering",
language: "en"
},
{
name: "Paging",
language: "en"
},
{
name: "Sorting",
language: "en"
},
{
name: "Selection",
language: "en",
inherit: true
}
]
});
});
</script>
</head>
<body>
<div id="row1" class="row">
<div class="col-md-3">
<h3>Vendor</h3>
<ul id="list1">
<li>Vendor Category</li>
<li>Vendor Master</li>
</ul>
<h3>Category</h3>
<ul id="list1">
<li>Catalog Category</li>
<li>Catalog Unit of Measure</li>
<li>Catalog Currency</li>
<li>Catalog Master</li>
</ul>
</div>
<div class="col-md-9">
<h1 id="heading1">Vendor Category</h1>
<hr/>
<button id="button1">Add New Category</button>
<hr/>
<div id="grid1"></div>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://designer.igniteui.com/packages/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/themes/infragistics/infragistics.theme.css">
<link rel="stylesheet" href="http://designer.igniteui.com/css/structure/infragistics.css">
<!--
Update the Ignite UI script references to your licensed copies before deploying.
Ignite UI License: http://www.infragistics.com/legal/license/ultimate/
-->
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.min.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.core.js"></script>
<script src="http://designer.igniteui.com/js/infragistics.lob.js"></script>
</head>
<body>
<div id="row1" class="row">
<div class="col-md-3">
<h3>Vendor</h3>
<ul id="list1">
<li>Vendor Category</li>
<li>Vendor Master</li>
</ul>
<h3>Category</h3>
<ul id="list1">
<li>Catalog Category</li>
<li>Catalog Unit of Measure</li>
<li>Catalog Currency</li>
<li>Catalog Master</li>
</ul>
</div>
<div class="col-md-9">
<h1 id="heading1">Vendor Category</h1>
<hr/>
<button id="button1">Add New Category</button>
<hr/>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment