Web サービスに接続しようとしている小さな Web アプリケーションを作成しました。何らかの理由で、エラー「200」が表示されます。
機能は単純です:
1 ) ユーザーが値 (製品番号) を Home.html ページに入力します。
2 ) サービスが呼び出され、入力された値に基づいて検索が実行されます。
3 ) 結果が見つかった場合は、SearchResult.html ページに製品番号を出力します。
Home.html
<!DOCTYPE html>
<!--[if IEMobile 7 ]> <html class="no-js iem7"> <![endif]-->
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="cleartype" content="on">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/touch/apple-touch-icon-144x144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/touch/apple-touch-icon-114x114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/touch/apple-touch-icon-72x72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="img/touch/apple-touch-icon-57x57-precomposed.png">
<link rel="shortcut icon" href="img/touch/apple-touch-icon.png">
<!-- Tile icon for Win8 (144x144 + tile color) -->
<meta name="msapplication-TileImage" content="img/touch/apple-touch-icon-144x144-precomposed.png">
<meta name="msapplication-TileColor" content="#222222">
<script src="js/vendor/modernizr-2.6.1.min.js"></script>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"> </script>
</head>
<body>
<header class="Navigation">
<div class="headerImage"><img src="images/logo-small.png" alt="Home"/</div>
</header>
<div id="product" class="Banner">
Product Search
</div>
<br />
<div class="nine-tenths">
Please enter a product number.
</div>
<input id="productNum" class="productNum" type="text" placeholder="Enter Product Number"/>
<br />
<button type="button" id="btnSearch" onclick="btnSearch()">Search</button>
<script src="js/main.js"></script>
</body>
main.JS
function btnSearch() {
// document.location.href = 'SearchResult.html';
var productNum= $("#productNum").val();
alert(productNum);
var ajaxSearch = "http://localhost:8008/Product/ProductList/GetProduct.php?prod_num?" + productNum;
alert(ajaxSearch);
$.ajax(ajaxSearch,
{
beforeSend: function (xhr) {
// $.mobile.showPageLoadingMsg();
},
complete: function () {
// $.mobile.hidePageLoadingMsg();
},
contentType: 'application/json',
dataType: 'jsonp',
jsonp: 'callback',
type: 'GET',
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(xhr.responseText);
//alert(thrownError);
},
success: function (data) {
var result = data.GetEmployeeListingResult;
$.each(result, function (index, output) {
$('#EmployeeList').append('<li> <a href=SearchResult.html?productNum=' + output.prod + '> </a> .....</li>');
});
//$('#EmployeeList').listview('refresh');
}
});
}
SearchResult.html
<table style="width:100%;" class="searchResultFound">
<tr>
<td style="width: 10%;">
<img src="images/resultFound.png" align="left">
</td>
<td>
<input id="productNum" type="text" class="no-outline " disabled="disabled" value="">
<label>Was found</label>
</td>
</tr>
</table>
<table style="width:100%;" class="searchResultNotFound">
<tr>
<td style="width: 10%;">
<img src="images/resultNotFound.png" align="left">
</td>
<td>
<input id="productNum" type="text" class="no-outline " disabled="disabled" value="">
<label>Was not found</label>
</td>
</tr>
</table>
このサイトを例として使用してみました (従業員のサイトへの参照が表示される理由):
ありがとう