Anyone got any clues?  Anyone at all?

Rick

From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Rick Faircloth
Sent: Tuesday, March 06, 2007 9:42 AM
To: 'jQuery Discussion.'
Subject: [jQuery] Need help implementing validation...

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/

Reply via email to