JavaScript - First Post - Using Date Object
This is my first post... and a quick question that is mostly likely easy for most of you!!
I am pulling in some data from an MySQL database and generating a graph using RGraph and some HTML. The date pulled in is shown as 2011-01-01 for example. I would like to simply format the date and turn into Jan, 01, 11 or similar. Any recommendations on using Date Object to format that in to the date text? Similar TutorialsI am trying to use my date Object function to get the date from the comp but my variables in my function are coming up undefined. Here is my function: Code: function displayTime() { var currentTime, hour, minute, second, range, m, s currentTime = new Date() var hourInt = currentTime.getHours() var minuteInt = currentTime.getMinutes() var secondInt = currentTime.getSeconds() if (hourInt > 12) { range = "PM" hourInt -= 12 } else { range = "AM" } hour = String(hourInt) if (minuteInt < 10) { m = String(0) + String(minuteInt) } minute = m if (secondInt < 10) { s = String(0) + String(secondInt) } second = s document.timeForm.timeBox.value = hour + ":" + minute + ":" + second + " " + range alert(hour + ":" + minute + ":" + second + " " + range) I appreciate the help As you can see in the attached Firebug screen capture, I am setting up a new Date object with "2011", "4", "23" but in the watch window you can see it is setting up the date object with a month of May instead of April. I also tried 2011, 4, 23 (no quotes) and no improvement. What am I missing? Hi, My JS Date validation was failing for a date which as per business is a valid date (01/01/0001) - MM/DD/YYYY It seems that the constructor for Date object is doing something funny.. var dayobj = new Date(yearfield, monthfield-1, dayfield) wasn't working for this case whereas teh one mentioned below seems to be working fine : var dayobj = new Date() dayobj.setFullYear(yearfield,monthfield-1,dayfield) What's the trick here ?? Hey guys, this is an assignment for school. I have most of the code done but I cant figure out how to completely finish one part of the assignment. I bolded the part in which i'm having trouble with. Heres the Directions per the Instructor: Create a new HTML document that creates a listing of the days and date for the current month. 1. Create a new array, named monthArray that holds the names of the all of the months in a year, i.e. January, February… 2. Create a new array, named weekDaysArray that holds all of the days of the week, i.e. Sun, Mon, Tue,…. 3. Get today’s date by using the Date object, without initializing a value for the object and save it in a variable named todaysDate. a. Using the Date object methods, break up the value of todaysDate into variables that hold each of the pieces of the date, by assigning the values to the following variables: (see page 169 in text) i. currYr = year ii. currMon = month as an integer iii. currDate = day of the month iv. currDay = the day of the week as an integer 4. Use a document.write statement display the name of the month followed by the 4 digit year. (i.e. October 2011) a. Use currMon as the index to get the name of the month from the monthArray created in step 1. b. Use the variable currYr created in step 3. c. Include a blank line after this displayed line 5. Determine the name of the first day of the current month. a. Using the correct Date Object method, get the integer for the day of the week for the first day of the current month. (hint: you will need to pass the year, month and the day value of 1 to the Date Object to get this number) 6. Use a document.write statement to display every day of the current month on a new line in the format of the name of the day followed by the integer for the date. a. Use a while loop to keep track of the number of days written for the month. b. Use a for loop to write out the days of the week from the array created in step 2 under the name of the current month and year. Example output: October 2011 Sat 1 Sun 2 Mon 3, etc….until all 31 days are displayed. My Code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Assignment 9</title> <script type="text/javascript"> var monthArray = new Array ("January","February","March","April","May","June","July","August","September","October","November","December"); var weekDaysArray = new Array ("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"); var todaysDate = new Date(); var currYr = todaysDate.getFullYear(); var currMon = todaysDate.getMonth(); var currDate = todaysDate.getDate(); var currDay = todaysDate.getDay(); document.write(monthArray[currMon] + " " +currYr); document.write("<br />"); document.write(weekDaysArray[currDay] + "<br />"); var count = 0; while (count < 31) { count++; } for(var count = 0 ; count < 31 ; count++) { document.write(weekDaysArray[count]+ "<br />"); } </script> </head> <body> </body> </html> The goal is for selectedDay to be assigned the value of the system variable Mainpackage.subclass0.subclass1.firstDay and then incremented by two days. Mainpackage.subclass0.subclass1.firstDay needs to be unchanged. Important system variable in red. To be 'manipulated and used' variable in green. Even with an intermediary, third, dummy variable it doesn't work: Code: //Declarations and instantiations var systemDate = new Date(); var selectedDay = new Date(); Mainpackage.subclass0.subclass1.firstDay ; //Assignments and manipulations systemDate = Mainpackage.subclass0.subclass1.firstDay ; selectedDay = systemDate ; selectedDay .setDate( selectedDay .getDate()+2); //Logging console.log('Mainpackage.subclass0.subclass1.firstDay: ' +Mainpackage.subclass0.subclass1.firstDay +'\n' +'systemDate: ' +systemDate +'\n' +'selectedDay :' +selectedDay +'\n'); Console log is: Code: Mainpackage.subclass0.subclass1.firstDay: Tue Aug 24 2010 00:00:00 GMT-0400 (Eastern Daylight Time) systemDate: Tue Aug 24 2010 00:00:00 GMT-0400 (Eastern Daylight Time) selectedDay: Tue Aug 24 2010 00:00:00 GMT-0400 (Eastern Daylight Time) It doesn't work in my webapp : All variables change at the same time. i've written a js function to find the difference between two dates. the format being used is dd/mm/yyyy hh:mm. The function returns correct value when give one set of values, but go wrong with another set. examples are given below. set 1 : Time 1 = 24/02/2011 09:30 , time 2 = 24/02/2011 16:00 Output is corret here. It gives 6 Hours & 30 Minutes (after converting the difference) set 2: Time 1 = 24/02/2011 09:30 , time 2 = 25/02/2011 16:00 Here, it gives 31 days, 6 Hours & 30 Minutes. My code is given below. Also the alert of dates display strange values. Don't know if it is timezone issue. I wonder what is going wrong here Code: function compareDateTime(frmtime,totime) { var date1 = new Date(frmtime); var date2 = new Date(totime); var diff = new Date(); alert(date1); alert(date2); diff = (date2.getTime()-date1.getTime()); if (diff<0) { alert("From Time cannot be later than To Time!"); return 0; } else if (diff==0) { alert("From Time cannot be equal with To Time!"); return 0; } else { return diff; } } The returned diff value is broken down as following: Code: if (diff>0) { days = Math.floor(diff / (1000 * 60 * 60 * 24)); diff -= days * (1000 * 60 * 60 * 24); hours = Math.floor(diff / (1000 * 60 * 60)); diff -= hours * (1000 * 60 * 60); mins = Math.floor(diff / (1000 * 60)); alert(days+","+hours+","+mins); return true; } Please Help... Hi Script Experts I am facing issue in below code for Brisilia time zone.(GMT-3). Issue comes in October month only. It is going tobig loop. I am not getting how Date object is behaving here. Thanks in advance Pranav Sharma *********************************** <script type="text/javascript"> var nDate; var nCurrentYear = 2011; var nCurrentMonth = 10; nYear=2011; nMonth=10; var date = new Date(nYear, nMonth-1, 1); document.write('Month:'+date.getMonth() +':CurrentMonth:'+nCurrentMonth); while (date.getMonth() == nCurrentMonth-1) { nDate = date.getDate(); document.write(date.toDateString()); date = new Date(nCurrentYear, date.getMonth(), date.getDate()+1); } </script> ********************************** Hi, every time I try and alert: [ { number:0, secondnumber:0 }, { number:2, secondnumber:1 }, { number:1, secondnumber:2 } ] it just shows [object object], [object object], [object object]. Why is this and what can I do to make the record be shown as it is above in an alert? Thanks. I created a method for displaying an object's properties: Code: renderfunction = false; function showProperty (object, property) { document.write ('<td class="type">' + (typeof object[property]) + '</td>' + '<td class="name">' + property + '</td>'); document.writeln('<td class="value">' + ( (typeof object[property] != 'function') ? object[property] :( (property != 'showProperties') ? ( renderfunction ? object[property]() : ('<span class="self">NOT RENDERED</span>') ) : ('<span class="self">THIS</span>') ) ) + '</td>'); document.writeln('<td class="hasOwnProperty" >' + ( object.hasOwnProperty(property) ? "Local" : "Inherited" ) + '</td>'); if (typeof object[property] == 'function') { document.writeln ('<td class="function">' + object[property] + '</td>'); } else { document.writeln ('<td class="function"> </td>'); } } As long as renderfunction = false, the object is fine coming out of this function. However, if I change renderfunction to true, all my properties become undefined. Why isn't this working as I expect it to? How should I fix it? Thanks in advance, -Brian. I can't get any info from Firebug except that one line, uncaught exception [object Object]. The code fully worked, then I needed to make it dynamically create Sortables from the scriptaculous library based on how many X were in a table in my database, which I've done, and I'm thinking it may be a simple slight parse error of some type, I'm not too good with Javascript, because now my script barely works. I've double checked the script's source code, the PHP variables are exactly what they should be. Code: print<<<HERE Sortable.create('sortlist$box', { tag: 'img', overlap:'horizontal',constraint:false, containment: $list, dropOnEmpty: true, onChange: function(item) { var list = Sortable.options(item).element; if(changeEffect) changeEffect.cancel(); changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" }); }, onDrop: function(item) { var thing=Sortable.options(item).element.identify(); var anchors = document.getElementById(thing).childNodes.length-2; if(anchors > 20){ alert('This box had 20 creatures in it already, your last action has not been saved.'); window.location.reload(); } else{ new Ajax.Request("saveImageOrder.php", { method: "post", parameters: { data: Sortable.serialize("sortlist$box") } }); } } }); HERE; $box++; } ?> }); </script> if you solve this I'll send ya $10 via paypal Hi all, I'm stumped on finding a way in javascript to create an object factory whose instances are also object factories. In short I want something like that below, but no joy ... any clues? Code: function createClass () { return new createClass() function createClass() { return new createInstance () function createInstance () { //Default properties, values and methods which might later be extended } } } var createDoor = createClass(); var door1 = createDoor(); var door2 = createDoor(); var createChair = createClass(); var chair1 = createChair (); var chair2 = createChair (); Ignore post (if mod, please delete)
Hello together! I generate html code with jsp. In that jsp there a several framesets and frames. And yes i know, frames are not really up to date but it's an old program and i have to deal with it now. Anyway, in the top frameset i have an onload attribute like onload="load()". In the function load i want to access the Element.prototype object. But unfortunately typeof Element gives me "undefined". So i looked a little deeper and found that window.toString() gives me "[object]" and not as expected "[object window]" so somehow my window doesn't know that its construcor is Window. window.construcor is "undefined" as well. And i don't have access to the Element object. I really don't know where the error could be. When the page is loaded and i access the same window over the console, then everything is right. But in my function a can't get access to the objects i need. I also don't know what part of the code could be useful to post here, but maybe someone had a similar problem before? i should say that this problem only occurs in IE8. In IE9 it works perfectly. Has anyone any idea?? I'm writing a program that involves a network of interconnected nodes (or simply objects in my example below). It depends on being able to access properties of an object's linked objects (a bit oddly worded, sorry)... Problem is I'm not sure how to properly access those properties... see below please. <script> //This is an example of a problem im having in my own code... //I want to access the name of the object within the links array wintin the object... var objA = {name: "Object A", links: [objB, objC]}; var objB = {name: "Object B", links: [objC, objD, objE]}; var objC = {name: "Object C", links: [objB]}; var objD = {name: "Object D", links: [objE]}; var objE = {name: "Object E", links: [objD]}; //ex: I want to access the name of Object A's first link... console.log(objA.links[0].name); </script> I'm hoping to get "Object B"... But instead I get: TypeError: Result of expression 'objA.links[0]' [undefined] is not an object. Is there another way around this? Any thoughts are appreciated. Hello. Is there any way to get the variable name of an object from inside the object? E.g. PHP Code: function Bla(){ this.write = function(){ document.write(<objectname>); } } obj1 = new Bla(); obj1.write(); //Outputs obj1 Here is my script: PHP Code: function myTimer(seconds, obj){ this.seconds = seconds; this.obj = obj; this.startTimer = function(){ if(this.seconds>0){ this.seconds--; this.obj.innerHTML = this.seconds; this.timer = setTimeout("Timer.start()",1000); } } } Timer = new Timer(10, obj); Timer.startTimer(); Now the problem is that the variable that contains the object must be named "Timer". This way I cannot create new timer objects with different variable names I have tried: this.timer = setTimeout("this.start()",1000); but it doesn't work. That's why it would be good to detect the variable name and instead use something like this: this.timer = setTimeout(varname+".start()",1000); I would rather not have to pass the variable name through a parameter like this: Timer1 = new Timer(10, obj, "Timer1"); Thanks in advance. Quote: menu: function( a, b ) { $( b ).observe( 'click', function( event ) { event.stop(); if( $( a ).visible() ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); } else { $( a ).show(); $( b ).addClassName( 'selected' ); document.observe( 'click', function( e ) { if( e.target.id != a && e.target.id != b && !Element.descendantOf( e.target, $( a ) ) ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); } }); } }); $$( '#' + b + ' > a' ).each( function( element ) { element.observe( 'click', function( event ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); }); }); } This work's perfrect accept when i use it with others on the menu it leaves the other ones open, how do i get it to close the open one when i open a new menu.. Thanks. Not sure if this is possible in javascript: I'm looking for two different dates (bill date and due date) on an invoice that are captured by OCR. If one of them exists, but the other does not, I want the empty field to be 14 days before (or after) the other. For example: if the bill date is 7/27/2010 and the due date was not captured, I want to set the due date as 8/10/2010 (14 days after the bill date). If the due date was captured as 8/10/2010, but the due date is blank, I want to assign the bill date as 7/27/2010 (14 days before the due date). if both dates have values, do nothing. Thanks. Hello, I really need your help with one. How can I use the following code below to save the date from my popup window datepicker back into a var and relay it back onto its parent page? I can't seem to figure this out: Code: <html> <head> <script> function open_cal() { var str_html = "" + "<!DOCTYPE html>\n" + "<html lang=\"en\">\n" + "<head>\n" + "<meta charset=\"utf-8\">\n" + "<title>CALENDAR</title>\n" + "<link href=\"jq/jquery-ui.css\" rel=\"stylesheet\" type=\"text/css\">\n" + "<script src=\"jq/jquery.min.js\" type=\"text/javascript\"></" + "script>\n" + "<script src=\"jq/jquery-ui.min.js\" type=\"text/javascript\"></" + "script>\n" + "<script src=\"jq/datepicker.js\" type=\"text/javascript\"></" + "script>\n" + "</head>\n" + "<body>\n" + "<div id=\"text\" style=\"font: bold 10pt Tahoma\">Enter Approval Date:</div>\n" + "<div id=\"datepicker\"></div>\n" + "</body>\n" + "</html>" var j = window.open("","CALENDAR","width=200,height=250,status=no,resizable=yes,top=200,left=200") j.opener = self; j.document.write(str_html); } </script> </head> <body> <input onclick="open_cal()" type="button" value="Open" name="B1"> </body> </html> Datepicker.js: Code: $(function() { $( "#datepicker" ).datepicker({ dateFormat: 'dd/mm/yy', onSelect: function(dateText, inst) { alert(dateText) window.close() } }) }); Any help with this is greatly and mostly appreciated. Thanks in advance, Cheers, J Hi, I've inherited a Form which calculates a future date based on a calculation and then inserts today's date and the future date into a database. The day part of the date is formatted as a number. This is fine, but up to 9 the numbers display in single figures with no leading zeros. I want them to display leading zeros (e.g. 01, 02, 03, 04, 05, 06, 07, 08, 09, 10, 11... 30, 31) So; 1/12/2010 is NOT wanted 01/12/2010 IS wanted The inherited code originally set the Month names as "Jan", "Feb" etc, and it was easy to kludge these to 01, 02... 12, but I suspect there's a more elgant solution to this as well, this bit of the code works so it's not as vital to neaten this but my database needs dd/mm/yyyy format (it's a third party email program). Code: </script> <script type="text/javascript"> var todaysDate = new Date(); function updateExpiryDate(){ var weeklyMileage = document.getElementById('AvWeeklyMileage').value; var expiryDate; var weeks = 0; var expiryDateString = ''; if (!isNaN(parseInt(weeklyMileage))){ weeks = 700/weeklyMileage; expiryDate = new Date(todaysDate.getTime() + (1000 * 3600 * 24 * 7 * weeks)); var expiryDateString = expiryDate.getDate() + '/' + getMonthString(expiryDate.getMonth()+1) + '/' + expiryDate.getFullYear(); document.getElementById('expiryDate').innerHTML = expiryDateString; document.getElementById('ShoeExpiryDate').value = expiryDateString; } else { document.getElementById('ShoeExpiryDate').value = ''; document.getElementById('expiryDate').innerHTML = 'Please enter a valid weekly average mileage' } } function getMonthString(monthNumber){ var monthString = ""; switch(monthNumber){ case 1: monthString = "01"; break; case 2: monthString = "02"; break; case 3: monthString = "03"; break; case 4: monthString = "04"; break; case 5: monthString = "05"; break; case 6: monthString = "06"; break; case 7: monthString = "07"; break; case 8: monthString = "08"; break; case 9: monthString = "09"; break; case 10: monthString = "10"; break; case 11: monthString = "11"; break; case 12: monthString = "12"; break; default: // do nothing; } return monthString; } function setTodaysDate(){ var todaysDateString = todaysDate.getDate() + '/' + getMonthString(todaysDate.getMonth()+1) + '/' + todaysDate.getFullYear(); document.getElementById('todaysDate').innerHTML =todaysDateString; document.getElementById('DateOfPurchase').value = todaysDateString; } Can someone point me in the right direction please? I have a drop down menu where people can select a month, day and year. Based on their selection, I want to show them an image. If their selection is >= July 26, 2010 but <= July 25, 2011, show the red image; If their selection is >= July 26, 2011 but <= July 25, 2012, show the white image; If their selection is >= July 26, 2012 but <= July 25, 2013, show the blue image; If their selection is >= July 26, 2013 but <= July 25, 2014, show the yellow image; I don't know how to compare a selected date to a range of dates like this. |