myContactForm.com - Help Forum

[sasadmn]

I noticed that a date selector wasn't working on one of my new forms. I was able to temporarily fix it by replacing some of the code with the older JavaScript for the date selector. Hope it gets fixed soon. I've never had a form from MCF come out with something broken like that. Here's what I had to do to band-aid the problem:

<!-- this code block contains the fix. I reverted to the old JavaScript.-->
<tr style="margin: 0; padding: 0;">
<td style="background-color: #FFFFFF; border-bottom: 0px solid #D8D8D8; padding: 5px; clear: left; margin: 0;">
<label for="q3" style="float: left; width: 30%; padding-top: 4px; font-family: Arial; color: #000000; font-size: 14px;">Run Date: <span style="color: #FF0000">*</span></label> <SCRIPT LANGUAGE="JavaScript" SRC="http://www.mycontactform.com/js/CalendarPopup.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript">document.write(getCalendarStyles());</SCRIPT>
<SCRIPT LANGUAGE="JavaScript" ID="jscal1x">
var cal1x = new CalendarPopup("calendar");
</SCRIPT>
<input name="q3" type="text" id="date3" size="10" />
<a href="#" onClick="cal1x.select(document.contactForm.date3,'anchor3','MM/dd/yyyy'); return false;" title="cal1x.select(document.contactForm.date3,'anchor3','MM/dd/yyyy'); return false;" name="anchor3" id="anchor3"><img src="http://www.mycontactform.com/js/img/calendar.gif" alt="Select Date" border="0" style="vertical-align: bottom;" /></a>
<div id="calendar" style="position:absolute;visibility:hidden;background-color:white;layer-background-color:white;"></div>
</td>
</tr>





<!-- the following is the broken version that was generated by the new form:
<tr style="margin: 0; padding: 0;">
<td style="background-color: #FFFFFF; border-bottom: 0px solid #D8D8D8; padding: 5px; clear: left; margin: 0;">
<label for="q3" style="float: left; width: 30%; padding-top: 4px; font-family: Arial; color: #000000; font-size: 14px;">Run Date: <span style="color: #FF0000">*</span></label> <link href="https://www.mycontactform.com/js/jquery/jquery-ui.css" rel="stylesheet" type="text/css"/>
<style type="text/css">
div.ui-datepicker {
font-size: 10px;
}
</style>
<script src="https://www.mycontactform.com/js/jquery/jquery.js"></script>
<script src="https://www.mycontactform.com/js/jquery/jquery-ui.js"></script>
<script>
$(document).ready(function() {
$("#q3").datepicker({ dateFormat: 'mm-dd-yy', changeMonth: true, changeYear: true, yearRange: 'c-100:c+100' });
});
</script>
<input name="q3" type="text" id="q3" size="10" required="required" />
</td>
</tr>
-->

[mycontac]

This is likely a conflict with the CSS on your site. I would check that first.

Nick Ladd
myContactForm.com