Form Validation
Some of my form validations are not working and the date picker does not work.
URL: http://www.menofsteel.us/MenOfSteel2/reservations.php
Some of my form validations are not working and the date picker does not work.
URL: http://www.menofsteel.us/MenOfSteel2/reservations.php
the date picker is not working due to conflicting vversions of jquery being added.
yoou have a script tag near the top of the page top add jquery:
<script src="jquery.js"></script>
and further down is a tag for the date picker jquery:
<script type="text/javascript" src="webassist/jquery/jquery.js"></script>
<script type="text/javascript" src="webassist/jquery/jquery-ui.js"></script>
only one instance of jquery can be added to the page.
for the validations, you say:
"Some of my form validations are not working"
please be more specific. which ones? server validations? spry validations?
Also, please include a copy of the page.
I removed the entries (I did not manually add them... they were added the Form Builder):
<script type="text/javascript" src="webassist/jquery/jquery.js"></script>
<script type="text/javascript" src="webassist/jquery/jquery-ui.js"></script>
datepicker still doesn't work.
The Spry validations fonly work for name and event type.
looking at the source of your page, i see both jquery tags still there.
the webassist jquery tag is needed for the date picker, the first one needs to be removed.
as for the validation, many of the fields only have an invalid format message, and the required message is left blank:
<span class="textfieldInvalidFormatMsg">Invalid format.</span><span class="textfieldRequiredMsg"> </span>
for exmple, if i enter text in the phone number, an invalid format message displays, but leaving it blank, no message displays, because there is no required message entered.
I fixed the Spry Validations but i still can't get the Date Picker to work.
you both the original jquery reference and the web assist jquery reference.
change:
<link type="text/css" href="webassist/forms/fd_sharp_default/Datepicker/css/jquery-custom.css" rel="stylesheet">
<script type="text/javascript" src="webassist/jquery/jquery-ui.js"></script>
to:
<link type="text/css" href="webassist/forms/fd_sharp_default/Datepicker/css/jquery-custom.css" rel="stylesheet">
<script type="text/javascript" src="webassist/jquery/jquery.js"></script>
<script type="text/javascript" src="webassist/jquery/jquery-ui.js"></script>
I did that but it still does not work.
looking in the source, that code chunk is not changed, it still shows:
<link type="text/css" href="webassist/forms/fd_sharp_default/Datepicker/css/jquery-custom.css" rel="stylesheet">
<script type="text/javascript" src="webassist/jquery/jquery-ui.js"></script>
it should be:
<link type="text/css" href="webassist/forms/fd_sharp_default/Datepicker/css/jquery-custom.css" rel="stylesheet">
<script type="text/javascript" src="webassist/jquery/jquery.js"></script>
<script type="text/javascript" src="webassist/jquery/jquery-ui.js"></script>
It's there now but it still doesn't work. I checked the HTML source code.
URL: http://www.menofsteel.us/MenOfSteel2/reservations.php
looking at the source of the page, there are a number of problems,
around line 58, there is a second HTML tag:
<!DOCTYPE html>
<html dir="ltr" lang="en-US"><head><!-- Created by Artisteer v4.1.0.60046 -->
<meta charset="utf-8">
<title>Contact Us</title>
<meta name="viewport" content="initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no, width = device-width">
<!--[if lt IE 9]><script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<link rel="stylesheet" href="style.css" media="screen">
<!--[if lte IE 7]><link rel="stylesheet" href="style.ie7.css" media="screen" /><![endif]-->
<link rel="stylesheet" href="style.responsive.css" media="all">
<script src="script.js"></script>
<script src="script.responsive.js"></script>
<meta name="description" content="Description">
<meta name="keywords" content="Keywords">
<script src="webassist/progress_bar/jquery-blockui-formprocessing.js" type="text/javascript"></script>
<link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css">
<script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script>
<script src="webassist/forms/wa_servervalidation.js" type="text/javascript"></script>
<link href="webassist/forms/fd_sharp_default.css" rel="stylesheet" type="text/css">
<style>.art-content .art-postcontent-0 .layout-item-0 { color: #DBDBDB; background: #1F304D; padding-left: 0px; }
.art-content .art-postcontent-0 .layout-item-1 { padding-top: 10px;padding-left: 10px; }
.ie7 .art-post .art-layout-cell {border:none !important; padding:0 !important; }
.ie6 .art-post .art-layout-cell {border:none !important; padding:0 !important; }
</style>
<script src="webassist/forms/wa_clientvalidation.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#EventDate').datepicker({
changeMonth: true,
changeYear: true,
onClose: closeDatePicker_EventDate
});
});
function closeDatePicker_EventDate() {
var tElm = $('#EventDate');
if (typeof EventDate_Spry != null && typeof EventDate_Spry != "undefined" && EventDate_Spry.validate) {
EventDate_Spry.validate();
}
var docElm = document.getElementById("EventDate");
var tBlur = docElm.getAttribute("onBlur");
if (!tBlur) tBlur = docElm.getAttribute("onblur");
if (!tBlur) tBlur = docElm.getAttribute("ONBLUR");
if (tBlur) {
tBlur = String(tBlur).replace(/\bthis\b/g, "docElm");
eval(tBlur);
}
}
</script>
that code should be deleted, it is repeated from above.
in your css code block, you have the following:
#SimpleContact_Sharp_Default li:before {
content: none !important;
</style>
that css needs to be closed:
#SimpleContact_Sharp_Default li:before {
content: none !important;
}
</style>
your rresponsive script needs to be moved to be after the WA jquery script line.
Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.
These out-of-the-box solutions provide you proven, tested applications that can be up and running now. Build a store, a gallery, or a web-based email solution.