My objective is to have a cookie store reminder dates and times pulled from a SQL database. Then from there store the cookie as a JSON cookie and parse it. From here we loop through the cookie while setting up tables/rows/columns of data from the cookie. From this point we pop open a modal to show the visitor what reminders he/she has for the day. My thought was to loop through the cookie and check date and time to see if any has past current date and time and if so store true to a DatePasted variable and then show the modal. However the problem with this is if any one of the reminders is true it will show all the reminders in the list. we just want to show them what reminders have come up so far that are past current date and time. Sort of like Outlook reminders. The modal is created using jQuery.
The problem is that I need a way to control showing the modal and only the actual reminders that have past the current date and time from CookieTime. The CookieTime can have more then one Reminder for the day in it. So my thought was to loop through check the date and time of the CookieTime data and if any pass take that table row and store it in to a variable to show in the modal and plug in the rows of data that past. If they have then we need to show them the reminders modal.
Here's some pseudocode:
var myTable
for (loop through the cookie data and check each entries date and time)
CookieTime Reminder Date and Time
if CookieTime < Current Date/Time){
//Reminder has pasted the current date and time.
myTable = (First row of table to contain the titles of the table)
myTable = myTable + (rows of data from the cookie that have passed current date/time)
}
}
if CookieTime < Current Date/Time){
Print MyTable (Show the reminders window with data pasted...)
}
Here is the script I have so far:
//Prepare the variables for the table layout...
var root=document.getElementById('tubData');
var tab=document.createElement('table');
tab.className="mytable";
var tbo=document.createElement('tbody');
var row, cell;
tab.className="mytable";
//Store todays current date and time.
var currDate = new Date();
//Store todays date and time to date.
var date = new Date(currDate.getMonth() + 1 + "-" + currDate.getDate() + "-" + currDate.getFullYear() + " " + currDate.getHours() + ":" + currDate.getMinutes() + ":" + currDate.getSeconds());
$(document).ready(function(){
//Grab the Cookie data that mysql created and parse with JSon.
var reminders = $.cookie('reminders');
reminders = JSON.parse(reminders);
//Prepare creating the first row in the table.
row=document.createElement('tr');
for (var i=0,len=6; i<len; i++){
// Create the Header of the table.
//Check and see if the currDate Date/Time has pasted the CookieTime Date/Time...
var CookieTime = new Date(reminders[0].reminderdate + ' ' + reminders[0].remindertime); //Cookie Date/Time
var difference = CookieTime - currDate; //Subtract CookieTime from currDate to see if time pasted.
if (difference <= 0) {
//If the Current Date/Time pasted CookieTime lets show the modal.
//Show Reminders Modal below...
var DatePasted = true;
}else{
//Don't show Reminders Modal below...
var DatePasted = false;
}
cell=document.createElement('td');
//Create the Titles for each Column in the table.
switch(i){
case 0:
cell.innerHTML = "<img src='menubar/ico_delete16.gif' width='16' height='16'>";
break;
case 1:
cell.appendChild(document.createTextNode('Reminder Date'));
break;
case 2:
cell.appendChild(document.createTextNode('Title/Message'));
break;
case 3:
cell.appendChild(document.createTextNode('Priority'));
break;
case 4:
cell.appendChild(document.createTextNode('Call Type'));
break;
case 5:
cell.appendChild(document.createTextNode('Status'));
break;
}
row.appendChild(cell);
tbo.appendChild(row);
}
//Begin looping through the cookie array data to show on the following rows.
for (var i=0,len=reminders.length; i<len; i++){
row=document.createElement('tr');//Create a new row per loop.
//We will start looping though and showing the data of the cookie per cell.
for (var i=0,len=6; i<len; i++){
cell=document.createElement('td');
switch(i){
case 0: //Delete box for dismissing or snoozing a reminder.
if (reminders[0].tid==''){
cell.innerHTML = "<input name='remove" + i + "' id='remove" + i + "' type='checkbox' value='" + reminders[0].tid + "'>"
}else{
cell.innerHTML = "<input name='remove" + i + "' id='remove" + i + "' type='checkbox' value='" + reminders[0].thid + "'>"
}
break;
case 1: //Date and Time of the reminder here...
cell.appendChild(document.createTextNode(reminders[0].reminderdate + ' at ' + reminders[0].remindertime));
break;
case 2: //Title and message of the reminder here...
if ((reminders[0].title || '') == "")
{
cell.innerHTML = "<a href='reader.asp?tid=" + (reminders[0].tid || '') + "&cnt='" + (reminders[0].cnt || '') + "' >" + (reminders[0].message || '') + "</a>"
}
else
{
cell.innerHTML = "<a href='reader.asp?tid=" + (reminders[0].tid || '') + "&cnt='" + (reminders[0].cnt || '') + "' >" + (reminders[0].title || '') + '<br />' + (reminders[0].message || '') + "</a>"
}
break;
case 3: //Ticket Priority
switch(reminders[0].priority){
case 1:
cell.appendChild(document.createTextNode('Low'));
break;
case 2:
cell.appendChild(document.createTextNode('Normal'));
break;
case 3:
cell.appendChild(document.createTextNode('High'));
break;
case 4:
cell.appendChild(document.createTextNode('Critical'));
break;
case 5:
cell.appendChild(document.createTextNode('Emergency'));
break;
default:
cell.appendChild(document.createTextNode('Undefined'));
break;
}
break;
case 4: //Call Type here...
cell.appendChild(document.createTextNode((reminders[0].fieldvalues || '')));
break;
case 5: //The status of the ticket here...
switch(reminders[0].status){
case 1:
cell.appendChild(document.createTextNode('New'));
break;
case 2:
cell.appendChild(document.createTextNode('Active'));
break;
case 3:
cell.appendChild(document.createTextNode('Pending'));
break;
default:
cell.appendChild(document.createTextNode('Closed'));
break;
}
break;
}
row.appendChild(cell);
}
tbo.appendChild(row);
}
tab.appendChild(tbo);
root.appendChild(tab);
//Show JQuery Modal only if one of the dates/times has pasted CookieTimes
if (DatePasted == true){
$('#basic-modal-content').modal({
escClose:false,
});
}
});
== true.