[jQuery] Need help implementing validation...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii">
<META NAME="Generator" CONTENT="MS Exchange Server version 08.00.0681.000">
<TITLE>Need help implementing validation...</TITLE>
</HEAD>
<BODY>

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;">
 Click here 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;">
 
 </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>

</BODY>
</HTML>_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

Topic Participants
rick
josh
enchos
karl.rudd
John Resig

[jQuery] Need help implementing validation...

[jQuery] Need help implementing validation...

Topic Participants

rick

josh

enchos

karl.rudd

John Resig