PhoneGap アプリケーションで奇妙な動作に直面しています。私はこれが初めてなので、あなたのすべての助けがかなりのものになるでしょう。
2 つの Index.htmlファイルを設計した PhoneGap(Cordova) でアプリケーションを作成しました。Icon(my_notification_new) をクリックしたときに Index.html ファイルを使用してNotification.htmlに移動します (サーバーからロードされたリスト ビューに表示されるデータ)。
A) Index.html (完璧に機能します)
<!DOCTYPE html>
<html>
<head>
<!-- /* Title */ -->
<title>Newa: HTML Template</title>
<!-- /* Meta Tags */ -->
<meta charset="utf-8">
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- /* Stylesheets */ -->
<link rel="stylesheet" href="css/my-custom-theme.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div data-role="page">
<div class="header">
<p>Smart Self-Service</p>
</div>
<div class="content">
<div class="bar">
/***********Move to Notification.html******************/
<div class="one_half">
<a href="Notification.html">
<img src="images/my_notification_new.png" align="center" /></a>
<p class="dashfont" align="center">Notifications</p>
</div>
/********************************************************/
<div class="one_half">
<a href="#">
<img src="images/new_request_new.png" align="center" /></a>
<p class="dashfont" >Self-Service request</p>
</div>
</div>
<div class="bar">
<div class="one_half">
<a href="#">
<img src="images/setting.png" align="center" /></a>
<p class="dashfont" align="center">Settings</p>
</div>
<div class="one_half">
<a href="#">
<img src="images/exit.png" align="center" /></a>
<p class="dashfont" align="center"ali>Exit</p>
</div>
</div>
</div>
<div class="footer">
</div>
</div>
</body>
</html>
いくつかのデザインを変更した後、この Index.html を作成しました
B）Index.html（これを介してNotification.htmlに移動すると、リストビューでデータが表示されませんJSが実行されません）
<!DOCTYPE html>
<html>
<head>
<title>Worklist</title>
<meta charset="utf-8">
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css"/>
<link rel="stylesheet" href="css/style.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<style type="text/css">
#center_content{
text-align:center;
min-height:400px;
}
#dashboard{
width:350px;
margin:0px auto;
display:block;
clear:both;
text-align:center;
}
.dashaboard_icon{
padding:block;
padding:35px;
float:center;
margin-bottom:10px;
}
</style>
</head>
<body>
<div data-role="page" data-theme="f">
<div data-role="header" data-position="fixed">
<h1 style="white-space:pre-wrap">Smart Self Service</h1>
</div><!-- /header -->
<div data-role="content" data-theme="f">
<div id="center_content">
<div id="dashboard">
/********* Move to Notification.html**********/
<a href="Notification.html"><img id="dIcon_notification" src="images/mdpi/my_notification_new.png" class="dashaboard_icon" alt="" ></a>
/*******************/
<a href="#"><img id="dIcon_request" src="images/mdpi/new_request_new.png" class="dashaboard_icon" alt="" ></a>
<a href="#"><img id="dIcon_setting" src="images/mdpi/setting.png" class="dashaboard_icon" alt="" ></a>
<a href="#"><img id="dIcon_exit" src="images/mdpi/exit.png" class="dashaboard_icon" alt="" ></a>
</div>
</div>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
ここに私のNotification.html があります。これは完璧に機能します。
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css"/>
<script src="moment.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script type="text/javascript">
function soap() {
Hr_Offer();
Hr_Vacancy();
function Hr_Offer() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST","http://180.211.97.41:7777/orabpel/default/XXNotificationListRetrieval/1.0",true);
/*** Soap Envelop ***/
var sr= "<?xml version='1.0' encoding='UTF-8'?>";
sr+="<soap:Envelope xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\" xmlns:wsu=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-utility-1.0.xsd\">";
sr+="<soap:Header>";
sr+="<wsse:Security xmlns:wsse=\"http:\//docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\" xmlns=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\" xmlns:env=\"http://schemas.xmlsoap.org/soap/envelope/\" soap:mustUnderstand=\"1\">";
sr+="<wsse:UsernameToken xmlns:wsse=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\" xmlns=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\">";
sr+="<wsse:Username>CBROWN<\/wsse:Username>";
sr+="<wsse:Password Type=\"http:\//docs.oasis-open.org\/wss\/2004\/01\/oasis-200401-wss-username-token-profile-1.0#PasswordText\">welcome<\/wsse:Password>";
sr+="<\/wsse:UsernameToken>";
sr+="<\/wsse:Security>";
sr+="<\/soap:Header>";
sr+="<soap:Body xmlns:ns1=\"http://xmlns.oracle.com/bpel/mobile/Notificationlist\">";
sr+="<ns1:NotificationlistRetrievalREQ>";
sr+="<ns1:NotificationlistType>HR_OFFER<\/ns1:NotificationlistType>";
sr+="<ns1:Status>TODO<\/ns1:Status>";
sr+="<\/ns1:NotificationlistRetrievalREQ>";
sr+="<\/soap:Body>";
sr+="<\/soap:Envelope>";
/*** Send the POST request ***/
xmlhttp.setRequestHeader("Accept", "application/xml", "text/xml", "\*/\*");
xmlhttp.setRequestHeader("SOAPAction", "process");
xmlhttp.setRequestHeader("Content-Type", "text/xml; charset=utf-8");
xmlhttp.send(sr);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
//alert('Response'+xmlhttp.responseXML);
var xmlResult=xmlhttp.responseXML;
/*** Pull out the quote and author elements ***/
var notificationId = xmlResult.getElementsByTagName('NotificationId');
var notificationContext = xmlResult.getElementsByTagName('NotificationContext');
var subject = xmlResult.getElementsByTagName('Subject');
var startDate = xmlResult.getElementsByTagName('BeginDate');
var dueDate = xmlResult.getElementsByTagName('DueDate');
/*** Create arrays***/
var arrNotificationId=new Array();
var arrNotificationContext=new Array();
var arrSubject=new Array();
var arrStartDate=new Array();
var arrDueDate=new Array();
/*** Loop through each quote elements yanking out the values and pushing them into the array ***/
for (i=0; i<notificationId.length; i++)
{
arrNotificationId.push(notificationId[i].childNodes[0].nodeValue);
arrNotificationContext.push(notificationContext[i].childNodes[0].nodeValue);
arrSubject.push(subject[i].childNodes[0].nodeValue);
//alert(startDate[i].childNodes[0].nodeValue);
var tempStart=startDate[i].childNodes[0].nodeValue;
var date_start = moment(tempStart).format("DD-MM-YYYY");
arrStartDate.push(date_start);
var tempDue=startDate[i].childNodes[0].nodeValue;
var date_due= moment(tempDue).format("DD-MM-YYYY");
arrDueDate.push(date_due);
}
/*** Display in Listview ***/
for (var s in arrNotificationId) {
//alert(arrSubject[s]);
$("#list_workList").append($("<li><a style=\"white-space:pre-wrap;\" href='" + arrSubject[s].link + "'>"+ arrSubject[s].toString() +"\n"+"Start Date :"+arrStartDate[s]+" "+"Due Date :"+arrDueDate[s]+ "</a></li>"));
}
$('#list_workList').listview('refresh');
}
else
{
alert('Error '+xmlhttp.status);
}
}
}
}
function Hr_Vacancy() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST","http://ip:port/orabpel/default/XXNotificationListRetrieval/1.0",true);
/*** Soap Envelop ***/
var sr= "<?xml version='1.0' encoding='UTF-8'?>";
sr+="<soap:Envelope xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\" xmlns:wsu=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-utility-1.0.xsd\">";
sr+="<soap:Header>";
sr+="<wsse:Security xmlns:wsse=\"http:\//docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\" xmlns=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\" xmlns:env=\"http://schemas.xmlsoap.org/soap/envelope/\" soap:mustUnderstand=\"1\">";
sr+="<wsse:UsernameToken xmlns:wsse=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\" xmlns=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\">";
sr+="<wsse:Username>Hello<\/wsse:Username>";
sr+="<wsse:Password Type=\"http:\//docs.oasis-open.org\/wss\/2004\/01\/oasis-200401-wss-username-token-profile-1.0#PasswordText\">world<\/wsse:Password>";
sr+="<\/wsse:UsernameToken>";
sr+="<\/wsse:Security>";
sr+="<\/soap:Header>";
sr+="<soap:Body xmlns:ns1=\"http://xmlns.oracle.com/bpel/mobile/Notificationlist\">";
sr+="<ns1:NotificationlistRetrievalREQ>";
sr+="<ns1:NotificationlistType>HR_VACANCY<\/ns1:NotificationlistType>";
sr+="<ns1:Status>TODO<\/ns1:Status>";
sr+="<\/ns1:NotificationlistRetrievalREQ>";
sr+="<\/soap:Body>";
sr+="<\/soap:Envelope>";
/*** Send the POST request ***/
xmlhttp.setRequestHeader("Accept", "application/xml", "text/xml", "\*/\*");
xmlhttp.setRequestHeader("SOAPAction", "action_name");
xmlhttp.setRequestHeader("Content-Type", "text/xml; charset=utf-8");
xmlhttp.send(sr);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
//alert('Response'+xmlhttp.responseXML);
var xmlResult=xmlhttp.responseXML;
/*** Pull out the quote and author elements ***/
var notificationId = xmlResult.getElementsByTagName('NotificationId');
var notificationContext = xmlResult.getElementsByTagName('NotificationContext');
var subject = xmlResult.getElementsByTagName('Subject');
var startDate = xmlResult.getElementsByTagName('BeginDate');
var dueDate = xmlResult.getElementsByTagName('DueDate');
/*** Create arrays***/
var arrNotificationId=new Array();
var arrNotificationContext=new Array();
var arrSubject=new Array();
var arrStartDate=new Array();
var arrDueDate=new Array();
/*** Loop through each quote elements yanking out the values and pushing them into the array ***/
for (i=0; i<notificationId.length; i++)
{
arrNotificationId.push(notificationId[i].childNodes[0].nodeValue);
arrNotificationContext.push(notificationContext[i].childNodes[0].nodeValue);
arrSubject.push(subject[i].childNodes[0].nodeValue);
var tempStart=startDate[i].childNodes[0].nodeValue;
var date_start = moment(tempStart).format("DD-MM-YYYY");
arrStartDate.push(date_start);
var tempDue=startDate[i].childNodes[0].nodeValue;
var date_due= moment(tempDue).format("DD-MM-YYYY");
arrDueDate.push(date_due);
}
/*** Display in Listview ***/
for (var s in arrNotificationId) {
//alert(arrSubject[s]);
$("#list_workList").append($("<li><a style=\"white-space:pre-wrap;\" href='" + arrSubject[s].link + "'>"+ arrSubject[s].toString() +"\n"+"Start Date :"+arrStartDate[s]+" "+"Due Date :"+arrDueDate[s]+ "</a></li>"));
}
$('#list_workList').listview('refresh');
}
else
{
alert('Error '+xmlhttp.status);
}
}
}
}
}
</script>
</head>
<body onload="soap()">
<div data-role="page" data-theme="f">
<form name="Worklist" action="" method="post">
<div>
<div id="response" />
</div>
</form>
<div data-role="header" data-position="fixed">
<h1>Worklist</h1>
</div><!-- /header -->
<div data-role="content">
<ul data-role="listview" data-theme="c" id="list_workList">
</ul>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
そして奇妙なことは、Eclipseブラウザーとプレビューで動作することです。