Linux ip-172-26-7-228 5.4.0-1103-aws #111~18.04.1-Ubuntu SMP Tue May 23 20:04:10 UTC 2023 x86_64
Your IP : 18.219.255.63
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jqgrid/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/themes/jquery-ui.custom.min.js" type="text/javascript"></script>
<!-- Import jQuery UI and jqGrid UI
<link href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" rel="stylesheet" media="screen" type="text/css" />
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<link href="jquery.jqGrid-4.4.1/css/ui.jqgrid.css" rel="stylesheet" media="screen" type="text/css" /> -->
<!-- Import jQuery jqGrid JS files
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://trirand.com/blog/jqgrid/js/jquery.jqGrid.min.js"></script>
<script type="text/javascript" src="http://trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="http://trirand.com/blog/jqgrid/themes/ui.jqgrid.css"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css"></script> -->
<!-- Import jQuery UI and <span class="hiddenSpellError" pre="and ">jqGrid</span> UI
<link href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" rel="stylesheet" media="screen" type="text/css" />
<link href="jquery.jqGrid-4.4.1/css/ui.jqgrid.css" rel="stylesheet" media="screen" type="text/css" /> -->
<script type="text/javascript">
/*
$(window).ready(function(){
var mydata = [{
name: "Toronto",
country: "Canada",
continent: "North America"
}, {
name: "New York City",
country: "USA",
continent: "North America"
}, {
name: "Silicon Valley",
country: "USA",
continent: "North America"
}, {
name: "Paris",
country: "France",
continent: "Europe"
}]
$("#grid").jqGrid({
data: mydata,
datatype: "local",
colNames: ["Name", "Country", "Continent"],
colModel: [{
name: 'name',
index: 'name',
editable: true,width:150 // set it to false if you don't want the column to be editable
}, {
name: 'country',
index: 'country',
editable: true,width:150
}, {
name: 'continent',
index: 'continent',
editable: true,width:150
}],caption: "Stack Overflow Example",
rowNum:10,
rowList:[2,4,8,16],
height:'250',
width:'900',
pager: '#pager',
'cellEdit': true, // TRUE = turns on celledit for the grid.
'cellsubmit' : 'clientArray',
editurl: 'clientArray',
});
});
$(window).ready(function(){
var data = [[48803, "DSK1", "", "02200220", "OPEN"], [48769, "APPR", "", "77733337", "ENTERED"]];
$("#grid2").jqGrid({
datatype: "local",
height: 250,
colNames: ['Inv No', 'Thingy', 'Blank', 'Number', 'Status'],
colModel: [{
name: 'id',
index: 'id',
width: 60,
sorttype: "int"},
{
name: 'thingy',
index: 'thingy',
width: 90,
sorttype: "date"},
{
name: 'blank',
index: 'blank',
width: 30},
{
name: 'number',
index: 'number',
width: 80,
sorttype: "float"},
{
name: 'status',
index: 'status',
width: 80,
sorttype: "float"}
],
caption: "Stack Overflow Example",
height:'250',
width:'900',
// ondblClickRow: function(rowid,iRow,iCol,e){alert('double clicked');}
});
var names = ["id", "thingy", "blank", "number", "status"];
var mydata = [];
for (var i = 0; i < data.length; i++) {
mydata[i] = {};
for (var j = 0; j < data[i].length; j++) {
mydata[i][names[j]] = data[i][j];
}
}
for (var i = 0; i <= mydata.length; i++) {
$("#grid2").jqGrid('addRowData', i + 1, mydata[i]);
}
/*
$("#grid").jqGrid('setGridParam', {onSelectRow: function(rowid,iRow,iCol,e){alert('row clicked');}});
*/
/*
$("#grid2").jqGrid('setGridParam', {ondblClickRow: function(rowid,iRow,iCol,e){alert('double clicked');}});
});
$(document).ready(function () {
'use strict';
var gidData = [
{ id: "1", orderdate: "2013-10-01", customer: "customer", price: "200.00", vat: "10.00", completed: true, shipment: "TN", total: "210.00"},
{ id: "2", orderdate: "2013-10-01", customer: "customer2", price: "300.00", vat: "20.00", completed: false, shipment: "FE", total: "320.00"},
{ id: "3", orderdate: "2011-07-30", customer: "customer3", price: "400.00", vat: "30.00", completed: false, shipment: "FE", total: "430.00"},
{ id: "4", orderdate: "2013-10-04", customer: "customer4", price: "200.00", vat: "10.00", completed: true, shipment: "TN", total: "210.00"},
{ id: "5", orderdate: "2013-11-31", customer: "customer5", price: "300.00", vat: "20.00", completed: false, shipment: "FE", total: "320.00"},
{ id: "6", orderdate: "2013-09-06", customer: "customer6", price: "400.00", vat: "30.00", completed: false, shipment: "FE", total: "430.00"},
{ id: "7", orderdate: "2011-08-30", customer: "customer7", price: "200.00", vat: "10.00", completed: true, shipment: "TN", total: "210.00"},
{ id: "8", orderdate: "2013-10-03", customer: "customer8", price: "300.00", vat: "20.00", completed: false, shipment: "FE", total: "320.00"},
{ id: "9", orderdate: "2013-09-01", customer: "customer9", price: "400.00", vat: "30.00", completed: false, shipment: "TN", total: "430.00"},
{ id: "10", orderdate: "2013-09-08", customer: "customer10", price: "702.00", vat: "30.00", completed: true, shipment: "IN", total: "530.00"},
{ id: "11", orderdate: "2013-09-08", customer: "customer11", price: "500.00", vat: "30.00", completed: false, shipment: "FE", total: "530.00"},
{ id: "12", orderdate: "2013-09-10", customer: "customer12", price: "500.00", vat: "30.00", completed: false, shipment: "FE", total: "530.00"},
{ id: "1", orderdate: "2013-10-01", customer: "customer", price: "200.00", vat: "10.00", completed: true, shipment: "TN", total: "210.00"},
{ id: "2", orderdate: "2013-10-01", customer: "customer2", price: "300.00", vat: "20.00", completed: false, shipment: "FE", total: "320.00"},
{ id: "3", orderdate: "2011-07-30", customer: "customer3", price: "400.00", vat: "30.00", completed: false, shipment: "FE", total: "430.00"},
{ id: "4", orderdate: "2013-10-04", customer: "customer4", price: "200.00", vat: "10.00", completed: true, shipment: "TN", total: "210.00"},
{ id: "5", orderdate: "2013-11-31", customer: "customer5", price: "300.00", vat: "20.00", completed: false, shipment: "FE", total: "320.00"},
{ id: "6", orderdate: "2013-09-06", customer: "customer6", price: "400.00", vat: "30.00", completed: false, shipment: "FE", total: "430.00"},
{ id: "7", orderdate: "2011-08-30", customer: "customer7", price: "200.00", vat: "10.00", completed: true, shipment: "TN", total: "210.00"},
{ id: "8", orderdate: "2013-10-03", customer: "customer8", price: "300.00", vat: "20.00", completed: false, shipment: "FE", total: "320.00"},
{ id: "9", orderdate: "2013-09-01", customer: "customer9", price: "400.00", vat: "30.00", completed: false, shipment: "TN", total: "430.00"},
{ id: "10", orderdate: "2013-09-08", customer: "customer10", price: "702.00", vat: "30.00", completed: true, shipment: "IN", total: "530.00"},
{ id: "11", orderdate: "2013-09-08", customer: "customer11", price: "500.00", vat: "30.00", completed: false, shipment: "FE", total: "530.00"},
{ id: "12", orderdate: "2013-09-10", customer: "customer12", price: "500.00", vat: "30.00", completed: false, shipment: "FE", total: "530.00"}
],
theGrid = $("#theGrid"),
numberTemplate = {formatter: 'number', align: 'right', sorttype: 'number'}
theGrid.jqGrid({
url:'jqGridData.php',
datatype: 'json',
colNames: ['Customer', 'Date', 'Price', 'VAT', 'Total', 'Completed', 'Shipment'],
colModel: [
{name: 'customer', index: 'customer', width: 90, editable:true},
{name: 'orderdate', index: 'orderdate', width: 100, align: 'center', sorttype: 'date',
formatter: 'date', datefmt: 'd-M-Y'},
{name: 'price', index: 'price', width: 55, template: numberTemplate},
{name: 'vat', index: 'vat', width: 42, template: numberTemplate},
{name: 'total', index: 'total', width: 50, template: numberTemplate},
{name: 'completed', index: 'completed', width: 30, align: 'center', formatter: 'checkbox',
edittype: 'checkbox', editoptions: {value: 'Yes:No', defaultValue: 'Yes'}},
{name: 'shipment', index: 'shipment', width: 80, align: 'center', formatter: 'select',
edittype: 'select', editoptions: {value: 'FE:FedEx;TN:TNT;IN:Intime;us:USPS', defaultValue: 'Intime'}}
],
autowidth: true,
gridview: true,
rownumbers: false,
rowNum: 10,
rowList: [5, 10, 15],
pager: '#gridPager',
viewrecords: true,
caption: 'Edit Commands Buttons',
height: '100%',
gridComplete : function () {
var maxDate;
var rowIDs = jQuery("#theGrid").jqGrid('getDataIDs');
for (var i = 0; i < rowIDs.length ; i++)
{
var rowID = rowIDs[i];
var row = jQuery('#theGrid').jqGrid ('getRowData', rowID);
if(i==0)
{
maxDate = new Date(row.orderdate);
}
else
{
if(maxDate < new Date(row.orderdate))
{
maxDate = new Date(row.orderdate);
}
}
}
$("#maxDateField").val(maxDate);
}
});
});
*/
function showJQGrid() {
var AllApplicationList=[{"AppId":1004,"TenantId":1,"AppName":"Sensiple IT Help Desk"}, {"AppId":2000,"TenantId":1,"AppName":"HR Help Desk"}, {"AppId":3000,"TenantId":1,"AppName":"Admin Desk"}, {"AppId":4000,"TenantId":1,"AppName":"Transport Facility"}, {"AppId":5000,"TenantId":2,"AppName":"Security Services"}, {"AppId":6000,"TenantId":5,"AppName":"Premises"},{"AppId":6001,"TenantId":8,"AppName":"Head Office"},{"AppId":6002,"TenantId":14,"AppName":"Ticket Incident"}, {"AppId":6003,"TenantId":14,"AppName":"Food Service"}, {"AppId":6005,"TenantId":14,"AppName":"Cleaning Service"}]
$("#ApplicationDetailsTable").jqGrid({
width:'900',
height: '100%',
datatype: "json",
data:AllApplicationList,
colNames: ["Application ID", "TenantId", "Application Name", "Actions","Inbuild Actions"],
colModel: [
{ name: 'AppId', index: 'AppId', hidden: true },
{ name: 'TenantId', index: 'TenantId',width:'60', resizable: true, align: 'center', title: false, sortable: true, searchoptions: { sopt: ['eq', 'ne', 'le', 'lt', 'gt', 'ge'] }, searchtype: "number" ,width:'70'},
{ name: 'AppName', index: 'AppName', sortable: true,width:'150' },
{ name: 'Actions', sortable: false,width:'150', search: false, fixed: true,align:'center',
formatter: function () {
return "<img src='../../Images/edit-icon.png' alt='Edit' id='editID' style='margin-left:12px;height:18px;width:18px;cursor:pointer;' /><img src='../../Images/Trash-can-icon.png' alt='Edit' id='deleteID'style='margin-left:12px;height:18px;width:18px;cursor:pointer;' onclick='deleteApplication()' />";
}
},
{ name: 'myac', width: 80, fixed: true, resizable: false, sortable: false,width:'150', search: false, resize: false, formatter: 'actions',
formatoptions: { keys: true}
},
],
rowNum: 10,
rowList: [5, 10, 20, 30],
pager: '#JQGridPaging',
viewrecords: true,
caption: "Application List Details",
sortname: "TenantId",
sortorder: "asc",
altRows: true,
altclass: 'jqgaltrow',
hoverrows: true,
loadonce: true,
gridview: false,
rownumWidth: 40,
rownumbers: true,
multiSort: true,
hidegrid: true,
toppager: false,
pgbuttons: true,
shrinkToFit: true,
emptyrecords: "No records to view",
loadtext:'Loading Data please wait ...'
});
jQuery("#ApplicationDetailsTable").jqGrid('filterToolbar', { searchOperators: false,searchOnEnter: false, });
$("#ApplicationDetailsTable").jqGrid('navGrid', '#JQGridPaging',
{
refresh: false, add: false, edit: false, del: true, search: true,
searchtext: "Search",
addtext: "Add",
edittext: "Edit",
deltext: "Delete",
deltitle: "Delete Application",
refreshtext: "Refresh",
position: 'left'
},
{},
{},
{
mtype: "POST",
reloadAfterSubmit: true,
url: '@Url.Action("DeleteApplicationDetails", "JQGridHome")',
resize: false,
closeOnEscape: true,
drag: false,
ajaxDelOptions: { contentType: 'application/json; charset=utf-8' },
serializeDelData: function (postdata) {
alert(postdata);
console.log(postdata);
return JSON.stringify({ AppId: postdata.id });
}
},
{ sopt: ['eq', 'cn', 'lt', 'le', 'bw', 'bn', 'in'], closeOnEscape: true, multipleSearch: true, overlay: true, width: 460, closeAfterSearch: true }
);
}
$(document).ready(function () {
showJQGrid();
});
</script>
</head>
<body>
<table id="grid" style='width:600px;'></table>
<div id="pager"></div><br>
<table id="grid2" ></table>
<br>
<table id='theGrid'></table>
<div id="gridPager"></div><br>
<div id="JqGridExampleContainer">
<table id="ApplicationDetailsTable">
</table>
<div id="JQGridPaging"></div>
</div>
</body>
</html>
|