Hi, I have a problem with 138 line ( var id = info.data.length;) when I try to run the app by PhoneGap Desktop/PhoneGap Developer App with the bellow code from “index.html”. It cannot add the notification after I click “Add” from “Add Reminder” section. Where could it be the problem and how can I fix it?
“/www/index.html”:
<!DOCTYPE html>
<html>
<head>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<title>Reminder App</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>
</head>
<body>
<div data-role="page" id="home">
<div data-role="header">
<h1>Reminder App</h1>
</div>
<div data-role="main" class="ui-content">
<p>
<a target="_blank" href="#add" style="text-decoration: none"><button>Add Reminder</button></a>
<a target="_blank" id="pending_click" href="#pending" style="text-decoration: none"><button>Pending Reminders</button></a>
<a target="_blank" href="#all" style="text-decoration: none"><button>All Reminders</button></a>
</p>
</div>
</div>
<div data-role="page" id="add">
<div data-role="header">
<a target="_blank" href="#home" class="ui-btn ui-icon-home ui-btn-icon-left">Home</a>
<h1>Add Reminder</h1>
</div>
<div data-role="main" class="ui-content">
<p>
Enter title and message for the reminder:
<input type="text" id="title" placeholder="Title" />
<input type="text" id="message" placeholder="Message" />
Enter date and time to trigger reminder:
<input type="date" id="date" />
<input type="time" id="time" />
<a target="_blank" href="javascript:add_reminder()" style="text-decoration: none"><button>Add</button></a>
</p>
</div>
</div>
<div data-role="page" id="pending">
<div data-role="header">
<a target="_blank" href="#home" class="ui-btn ui-icon-home ui-btn-icon-left">Home</a>
<h1>Pending</h1>
</div>
<div data-role="main" class="ui-content">
<table data-role="table" data-mode="column" id="pendingTable" class="ui-responsive table-stroke">
<thead>
<tr>
<th>Title</th>
<th>Time</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<div data-role="page" id="all">
<div data-role="header">
<a target="_blank" href="#home" class="ui-btn ui-icon-home ui-btn-icon-left">Home</a>
<h1>All Reminders</h1>
</div>
<div data-role="main" class="ui-content">
<table data-role="table" data-mode="column" id="allTable" class="ui-responsive table-stroke">
<thead>
<tr>
<th>Title</th>
<th>Time</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<script type="text/javascript">
var port = normalizePort(process.env.PORT || '1337');
var info = null;
document.addEventListener("deviceready", function(){
if(!localStorage.getItem("rp_data"))
{
var rp_data = {data: []};
localStorage.setItem("rp_data", JSON.stringify(rp_data));
}
info = JSON.parse(localStorage.getItem("rp_data"));
}, false);
function schedule(id, title, message, schedule_time)
{
cordova.plugins.notification.local.schedule({
id: id,
title: title,
message: message,
at: schedule_time
});
var array = [id, title, message, schedule_time];
info.data[info.data.length] = array;
localStorage.setItem("rp_data", JSON.stringify(info));
navigator.notification.alert("Reminder added successfully")
}
function add_reminder()
{
var date = document.getElementById("date").value;
var time = document.getElementById("time").value;
var title = document.getElementById("title").value;
var message = document.getElementById("message").value;
if(date == "" || time == "" || title == "" || message == "")
{
navigator.notification.alert("Please enter all details");
return;
}
var schedule_time = new Date((date + " " + time).replace(/-/g, "/")).getTime();
schedule_time = new Date(schedule_time);
alert(schedule_time);
var id = info.data.length;
cordova.plugins.notification.local.hasPermission(function(granted){alert("True/False "+granted);
if(granted == true)
{
schedule(id, title, message, schedule_time);
}
else
{
cordova.plugins.notification.local.registerPermission(function(granted) {
if(granted == true)
{
schedule(id, title, message, schedule_time);
}
else
{
navigator.notification.alert("Reminder cannot be added because app doesn't have permission");
}
});
}
});
}
$(document).on("pagebeforeshow","#pending",function(){
var html = '';
for(var count = 0; count < info.data.length; count++)
{
var schedule_time = new Date(info.data[count][3]).getTime();
var current_time = new Date().getTime();
if(current_time < schedule_time)
{
html = html + "<tr><td>" + info.data[count][1] + "</td><td>" + info.data[count][3] + "</td></tr>";
}
}
$("table#pendingTable tbody").empty();
$("table#pendingTable tbody").append(html).closest("table#pendingTable").table("refresh").trigger("create");
});
$(document).on("pagebeforeshow","#all",function(){
var html = '';
for(var count = 0; count < info.data.length; count++)
{
html = html + "<tr><td>" + info.data[count][1] + "</td><td>" + info.data[count][3] + "</td></tr>";
}
$("table#allTable tbody").empty();
$("table#allTable tbody").append(html).closest("table#allTable").table("refresh").trigger("create");
});
</script>
</body>
</html>