or
<
link
href
=
"@Url.Content("
~/Content/kendo/2013.2.716/kendo.common.min.css")"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"@Url.Content("
~/Content/kendo/2013.2.716/kendo.dataviz.min.css")"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"@Url.Content("
~/Content/kendo/2013.2.716/kendo.default.min.css")"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"@Url.Content("
~/Content/kendo/2013.2.716/kendo.dataviz.default.min.css")"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
script
src
=
"@Url.Content("
~/Scripts/kendo/2013.2.716/jquery.min.js")"></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/kendo/2013.2.716/kendo.all.min.js")"></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/kendo/2013.2.716/kendo.aspnetmvc.min.js")"></
script
>
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="KochAirMobileInventory._Default" %>
<!DOCTYPE html>
<
html
>
<
head
id
=
"Head1"
runat
=
"server"
>
<
META
HTTP-EQUIV
=
"Pragma"
CONTENT
=
"no-cache"
>
<
META
HTTP-EQUIV
=
"Expires"
CONTENT
=
"-1"
>
<
title
>Part Lookup</
title
>
<
link
href
=
"Content/kendo/2013.2.716/kendo.common.min.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"Content/kendo/2013.2.716/kendo.default.min.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"Content/kendo/2013.2.716/kendo.mobile.all.min.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
script
src
=
"Scripts/jquery-1.9.1.min.js"
type
=
"text/javascript"
></
script
>
<
script
src
=
"Scripts/kendo/2013.2.716/kendo.all.min.js"
type
=
"text/javascript"
></
script
>
<
style
>
.glass {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
opacity: 0.3;
background: #fff;
}
</
style
>
</
head
>
<
body
>
<!-- modal loading -->
<
div
id
=
"glass"
class
=
"glass"
style
=
"display: none;"
></
div
>
<!-- layout for the search view -->
<
div
data-role
=
"layout"
data-id
=
"SearchLayout"
>
<
header
data-role
=
"header"
>
<
div
data-role
=
"navbar"
>
<
span
data-role
=
"view-title"
></
span
>
</
div
>
</
header
>
</
div
>
<!-- this view is for entering the cutomer and part nubmer to view stock status -->
<
div
id
=
"SearchView"
data-role
=
"view"
data-title
=
"Search"
data-layout
=
"SearchLayout"
>
<
ul
data-role
=
"listview"
data-style
=
"inset"
>
<
li
>
<
label
>Customer #
<
input
id
=
"Customer"
type
=
"text"
value
=
"60506"
/>
</
label
>
</
li
>
<
li
>
<
label
>
Part
<
input
id
=
"Part"
type
=
"text"
value
=
"CF58.C"
/>
</
label
>
</
li
>
<
li
style
=
"text-align:center;"
>
<
label
>
<
a
class
=
"button"
data-role
=
"button"
href
=
"#ResultsView"
onclick
=
"GetData();"
>Go</
a
>
<!-- onclick="GetData();" -->
</
label
>
</
li
>
</
ul
>
</
div
>
<!-- layout for the results view -->
<
div
data-role
=
"layout"
data-id
=
"ResultsLayout"
>
<
header
data-role
=
"header"
>
<
div
data-role
=
"navbar"
>
<
a
class
=
"nav-button"
data-align
=
"left"
data-role
=
"backbutton"
>Back</
a
>
<
span
data-role
=
"view-title"
></
span
>
</
div
>
</
header
>
</
div
>
<!-- this is the results view that will show the branch and stock count for item searched -->
<
div
data-role
=
"view"
id
=
"ResultsView"
data-transition
=
"slide"
data-init
=
"mobileListViewDataBindInitFlat"
data-title
=
"Results"
data-layout
=
"ResultsLayout"
>
<
ul
id
=
"flat-listview"
data-role
=
"listview"
data-style
=
"inset"
></
ul
>
</
div
>
<
script
type
=
"text/ecmascript"
>
//data that is called via ajax for our listview in the
//results view...
var flatData;
//sample of the data returned
/*
[{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":2,"AvailQty":79,"Status":"A","Location":"usa"},
{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":3,"AvailQty":105,"Status":"A","Location":"usa"},
{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":4,"AvailQty":100,"Status":"A","Location":"usa"},
{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":5,"AvailQty":66,"Status":"A","Location":"usa"},
{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":6,"AvailQty":-11,"Status":"A","Location":"usa"},
{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":7,"AvailQty":79,"Status":"A","Location":"usa"},
{"CustomerId":"960506","CustomerName":"IAMS COM AIR ","PartNumber":"58.C ","Vnd":"CF","SellPrice":" 99.35","Id":8,"AvailQty":55,"Status":"A","Location":"usa"}]
*/
function GetData() {
showLoading();
var customer = $("#Customer").val();
var showPrice = false;
if (customer == "") {
customer = "60506";
} else {
showPrice = true;
}
$.ajax({
url: "api/branchitem/?partnumber=" + $("#Part").val() + "&customer=" + customer,
contentType: 'json',
success: function (data) {
flatData = "";
var price = "";
$.each(data, function (index, item) {
flatData += item.Location + " Quantity:" + item.AvailQty + ',';
price = item.SellPrice
});
flatData = flatData.substr(0, flatData.length - 1);
if (showPrice) {
flatData += ",Price: " + price.toString();
}
flatData = flatData.split(",");
flatData = flatData;
//attempt to destroy and recreate so the data will update...
$('#flat-listview').data('kendoMobileListView').destroy();
$("#flat-listview").kendoMobileListView({ dataSource: flatData });
hideLoading();
}
});
}
function mobileListViewDataBindInitFlat() {
//grab data from restful service
GetData();
}
var app = new kendo.mobile.Application(document.body);
function showLoading() {
$("#glass").show();
app.showLoading();
}
function hideLoading() {
$("#glass").hide();
app.hideLoading();
}
</
script
>
</
body
>
</
html
>