the next step in my ongoing learning curve with JavaScript
PROBLEM
All I want is is to have the date passed to the handler script (listing.php)once the date is clicked on within the calendar.
I am able to get it to pass when I select it and hit enter, but not when I just select it.
Looks like I am barking up the wrong tree with the code below. Any advice?
Javascript
WORKING
- first function calling the calendar
- second is supposed to submit it, but not in the manner I would like it to happen
<script language="JavaScript" id="js_calendar">
var calendar = new CalendarPopup("calendar_div");
calendar.setWeekStartDay(1); //set week start day to Monday
calendar.addDisabledDates("Feb 1, 2007",null); //disable dates on & after Feb 1, 2007
</script>
<script language="javascript">
var select_date = function (){
calendar.select(document.forms[0].date,'anchor','yyyyMMdd');
return false;
}
var submit_form = function (){
document.calendar_form.submit();
}
</script>
and the HTML
- the action is a debugging tool, it will be substituted with a JS call to populate a div with ajax once sorted out.
- form input will be hidden once debugged
<div id="calendar">
<form name="calendar_form" id="calendar_form" method="post" action="listing.php">
<input type="text" name="date" id="date" onsubmit="javascript:submit_form()"/>
<a href="#"
onmouseover="javascript:select_date()"
title="Click here to change date"
id="anchor" >select (calendar icon)
</a>
</form>
<div id="calendar_div"></div>
</div><!-- end calendar div -->
For a working demo, it can be found at:
projects.w3b.ca/ajax-calendar
this is coordinated with site
projects.w3b.ca/
Any thoughts?