Good morning, all.
Can't get any reaction from the validation code.
Here's my script and html. what's wrong with it?
(I've included my show/hide script and my CalculateMortgage
script in case there's a conflict)
The Mortgage Calculation still runs fine, but when I submit the
form without an entry I get a CF error stating that the expression
that calculates the payment can't be evaluated.
Isn't the validation code supposed to prevent submission when
a form field is blank? And in this case, with debug on, it should
stop all submissions?
But, it's pretty much like the validation code is not even active.
I don't get any kind of response from it.
Ideas?
Thanks!
Rick
<script type="text/javascript" src="jquery-1.1.2.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('div.calc').find('div.showMe').hide().end().find('table.clickMe').click(fu
nction() {
var answer = $(this).next();
if (answer.is(':visible')) {
answer.slideUp();
} else {
answer.slideDown();
}
});
});
</script>
<script type="text/javascript">
function CalculateMortgage(){
var Params = {};
// select all inputs of type text
$("input:text").each(function(){
Params[$(this).attr("name")] = $(this).val();
});
// "post" the form. The Param object mimics form fields
$.post("Mortgage_Calculation.cfm", Params,
function(data){
// this is the processing function.
// append what you get back to the element
with ID = Result after clearing its contents
$("#Result").empty().append(data);
}
);
}
</script>
<script type="text/javascript">
$.validator.defaults.debug = true;
$().ready(function() {
// validate Mortgage_Calculation_Form on keyup and submit
$("#Mortgage_Calculation_Form").validate({
event: "keyup",
rules: {
Principal: { required: true },
Interest: { required: true },
Years: { required: true },
},
messages: {
Principal: "Please enter the Principal.",
Interest: "Please enter the Interest Rate.",
Years: "Please enter the Years.",
}
});
</script>
And here's the pertinent html:
<div class="calc">
<table class="clickMe" width="418">
<tr>
<td style="font: Arial Helvetica San-Serif;
font-weight: normal;
font-size: 12px;
text-align: center;
cursor: hand;
padding-bottom: 10px;">
<u>Click here</u> to calculate mortgage payment.
</td>
</tr>
</table>
<div class="showMe">
<form id="Mortgage_Calculation_Form" Method="Post" Action="">
<table width="418">
<tr>
<td style="width: 202px;
padding-right: 4px;
font: Arial Helvetica San-Serif;
font-weight: bold;
font-size: 12px;
text-align: right;">
<label for="Principal">Principal</label>
</td>
<td style="width 202px;
text-align: left;">
<INPUT id="Principal" Name="Principal" Type="Text"
Value="#Get_Property_Details.Sale_Price#" Size="14" Class="TextInput01">
</td>
</tr>
<tr>
<td style="width: 202px;
padding-right: 4px;
font: Arial Helvetica San-Serif;
font-weight: bold;
font-size: 12px;
text-align: right;">
<label for="Interest">Interest Rate</label>
</td>
<td style="width 202px;
text-align: left;">
<INPUT id="Interest" Name="Interest" Type="Text"
Value="6" Size="14" Class="TextInput01">
</td>
</tr>
<tr>
<td style="width: 202px;
padding-right: 4px;
font: Arial Helvetica San-Serif;
font-weight: bold;
font-size: 12px;
text-align: right;">
<label for="Years">Years</label>
</td>
<td style="width 202px;
text-align: left;">
<INPUT id="Years" Name="Years" Type="Text" Value="30"
Size="14" Class="TextInput01">
</td>
</tr>
<tr>
<td style="width: 202px;
padding-right: 4px;
font: Arial Helvetica San-Serif;
font-weight: bold;
font-size: 12px;
text-align: right;">
Payment
</td>
<td style="width 202px;
text-align: left;
font: Arial Helvetica San-Serif;
font-size: 12px;">
<span id="Result"></span>
</td>
</tr>
<tr>
<td style="width: 202px;
padding-right: 4px;
font: Arial Helvetica San-Serif;
font-weight: bold;
font-size: 12px;
text-align: right;">
</td>
<td style="width 202px;
text-align: left;
font: Arial Helvetica San-Serif;
font-size: 12px;">
<INPUT Class="Submit" Value="Submit" Type="Submit"
onClick="CalculateMortgage();return false;">
</td>
</tr>
</table>
</form>
</div>
</div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
