help with garden calendar

carletongardener

I'm trying to make a calendar where the frost date is input and based on this date, a list of other dates are calculated that will be specific times from the input date. I have minimal programming skills and would appreciate any help.

I've gotten code that will input the frost date and output a single date (6 weeks prior to this date = tomato planting date). I wish the output button was a list of dates, or there were multiple buttons that pop up..... Maybe someone could help with adding one more date line and I can figure out how to repeat. Or direct me to the function I need to research more. Thanks!

test site: http://bioarray.us/generate%20planti...=5&d1=20&m1=10

code so far:

Expand|Select|Wrap|Line Numbers

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

</head>
 
<body>
 
<form>

  <p>

    <input type="text" name="date1" size="20">

    <br>

Date of last spring frost (mm/dd/yyyy)<br>

Enter month and day of the latest spring frost in your garden in the past 5 years or so. If you don't know this, use the date from <a href="http://www.burpee.com/ancillary/zonefinder.do">Burpee</a> or <a href="http://cdo.ncdc.noaa.gov/cgi-bin/climatenormals/climatenormals.pl?directive=prod_select2&prodtype=CLIM2001&subrnum">NOAA</a>. For year, enter this year - 2009.

<br>

<br>

<input type="button" value="Generate planting calendar!"

onclick="finddates(this);" />

  </p>

  <p>&nbsp;</p>

  <p>

    <input type="text" name="date2" size="20" readonly>

    Sow tomato seed indoors.<br>

    <br>

    <br>

      </p>

</form>
 
<script type="text/javascript">
 
document.forms(0).date1.value = dateToString(new Date())
 
function dateToString(d){

return [d.getMonth()+1,d.getDate()].join('/')
 
}
 
function finddates(x){

d = new Date(x.form.date1.value)

d = new Date(d.getYear(),d.getMonth(),d.getDate()-40)

x.form.date2.value = dateToString(d)
 
}

</script>

<br>

<br>

<br>

<br>

<br>
 
</body>

</html>
 
</body>

</html>

Post Reply

David Laakso

@carletongardener
Move post to appropriate board on this forum. (X)HTML/CSS does not meet need required...

Dormilich

@carletongardener
you could use a couple of checkboxes to set the dates (tomato, cucumber, ...) to be computed. the checkboxes' value could be the number of days to subtract/add to the current date. this way, the function triggered by the button needs to fetch all the checked checkboxes using their passed value to compute the date.

for a better styling of the page have a look at CSS, especially the properties padding and margin should be good to start.

finally, I think you'd better use HTML than XHTML to start with
- true XHTML (with the recommended mime type "application/xhtml+xml") is not supported by Internet Explorer
- XHTML served as "text/html" is treated as HTML
- XHTML must be well-formed, otherwise browsers give you an error (the so-called Yellow Screen Of Death (YSOD))
(empty elements (like <img>, <br>, <hr>) are written <tagname/> (<img/>, <br/>, <hr/>), & must always be escaped)

regards

carletongardener

Thanks for the suggestions!

I'm sorry I can't figure out how to move this thread and am not even sure where it should be moved to. (embarrassing...)

I converted to HTML, I think. I'm using DreamWeaver.

New test site: http://bioarray.us/planting%20calendar%202.html

Looks nicer now. I just need get the calculator functions to generate several different dates that are different lengths fo time form input date and enter these into the appropriate boxes.

New code:

Expand|Select|Wrap|Line Numbers

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<!-- DW6 -->

<head>

<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->

<title>Lodging - Calendar</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<link rel="stylesheet" href="mm_lodging1.css" type="text/css">

</head>

<body bgcolor="#999966">

<table width="100%" border="0" cellspacing="0" cellpadding="0">

    <tr>

    <td width="15" nowrap>&nbsp;</td>

    <td height="60" colspan="2" class="logo" nowrap><br>

    Skippy's Vegetable Garden</td>

    <td width="100%">&nbsp;</td>

    </tr>
 
    <tr bgcolor="#ffffff">

    <td colspan="4"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0"></td>

    </tr>
 
    <tr bgcolor="#a4c2c2">

    <td width="15" nowrap>&nbsp;</td>

    <td height="36" id="navigation" class="navText"><a href="http://www.carletongarden.blogspot.com/">HOME</a><a href="javascript:;"></a></td>

    <td>&nbsp;</td>

    <td width="100%">&nbsp;</td>

    </tr>
 
    <tr bgcolor="#ffffff">

    <td colspan="4"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0"></td>

    </tr>
 
    <tr bgcolor="#ffffff">

    <td valign="top" width="15"><img src="mm_spacer.gif" alt="" width="15" height="1" border="0"></td>

    <td valign="top" width="35"><img src="mm_spacer.gif" alt="" width="35" height="1" border="0"></td>

    <td width="710" valign="top"><br>

    <table border="0" cellspacing="0" cellpadding="2" width="610">

        <tr>

          <td class="pageName">Personalized Vegetable Garden Planting Calender</td>

        </tr>

    </table>

    <p>Enter the date of your last srping frost (mm/dd/yyyy)

    <form>

  <p>

    <input type="text" name="date1" size="20">

    <br>

Enter month and day of the latest spring frost in your garden in the past 5 years or so. If you don't know this, use the date from <a href="http://www.burpee.com/ancillary/zonefinder.do">Burpee</a> or <a href="http://cdo.ncdc.noaa.gov/cgi-bin/climatenormals/climatenormals.pl?directive=prod_select2&prodtype=CLIM2001&subrnum">NOAA</a>. For year, enter this year - 2009.

<br>

<br>

<input type="button" value="Generate planting calendar!"

onclick="finddates(this);" />

  </p>

  <p>&nbsp;</p>

  <p>

    <input type="text" name="date2" size="20" readonly>

    Sow tomato seeds indoors.<br>

    </p>

  <p>

    <input type="text" name="date3" size="20" readonly>

    Sow cucumber seeds indoors.</p>

  <p>

    <input type="text" name="date4" size="20" readonly>

    Sow sunflowers directly in the garden.</p>

  <p><br>

  </p>

    </form>
 
<script type="text/javascript">
 
document.forms(0).date1.value = dateToString(new Date())
 
function dateToString(d){

return [d.getMonth()+1,d.getDate()].join('/')
 
}
 
function finddates(x){

d = new Date(x.form.date1.value)

d = new Date(d.getYear(),d.getMonth(),d.getDate()-40)

x.form.date2.value = dateToString(d)
 
}

</script>

<br>

<br>

<br>

<br>

<br>
 
<br>

     *  &nbsp;<br>

      </p>

     *</td>

    <td>&nbsp;</td>

    </tr>
 
    <tr>

    <td width="15">&nbsp;</td>

    <td width="35">&nbsp;</td>

    <td width="710">&nbsp;</td>

    <td width="100%">&nbsp;</td>

    </tr>

</table>

</body>

</html>

acoder

Line 71 document.forms(0) should be document.forms[0].

PS. please use [code] tags when posting code.

PPS. Moved to the JavaScript forum.

carletongardener

Thanks SO much for the help! I'm all set. Here's the final link to my tool, if you want to generate a planting calender for your vegetable garden. http://bioarray.us/Skippy%27s%20plan...0calendar.html (Sorry I'm such a noob.)

David Laakso

Nice job. Validating the markup could be a nice touch. So might making it readable, for children of all ages, on landing. But these are trivial matters. Or, are they?

carletongardener

Thanks. I validated. Don't know how to make it readable. K

David Laakso

Change the body declaration to read:

Expand|Select|Wrap|Line Numbers

 
body { 

font: 100%/1.4 Helvetica, Arial, sans-serif;

margin:0;padding:0;

background:#fff;

}

100% is default. 1.4 is line-height.

re: sans
Completely delete each and every font-size rule throughout the style sheet and the styles embedded in the head of the document. Each will inherit default (100%) sans from the body declaration.

re:serif
Change the font-size for TNR and Georgia to 100% with a raw number (as above) for line-height if even needed. Bump either or both up a little if you like.

re: sans and serif
Users will now get their preference, rather than yours. And should users who know how to use their machine decide to go up or down in size from their default by scaling the fonts, they can do so in compliant browsers, and more easily in the IEs as well...

carletongardener

Thank you! I hope I did this right.

David Laakso

@carletongardener
So do i. Post to the forum and someone will check it...

help with garden calendar

Post your reply

Question stats

Most Active

Most Questions Answered

Top Questions

Latest Questions

Similar topics

More