1. Change the "Calculate" button from <input type="button"> to <input
type="submit">. That way the "submit" event that submitHandler
is attached to actually gets fired (<input type="button">'s do not
submit forms, only <input type="submit">'s do).
2. Jake's and my solutions aren't really meant to be used together. It's
either one or the other. Which one you choose really depends on
whether CalculateMortgage is needed in other areas besides that form. If
it is, then choose mine, as it stores all of that code in one
place (it'd also be easy to take CalculateMortgage and throw it into an
external file, should you need to). If the only place that
CalculateMortgage is needed is that form, then you can go with Jake's[1]
and simply remove the CalculateMortgage function (since
the code is already in the submitHandler).
3. If you do decide to go with Jake's solution, be aware that their's a typo
in it around line 100 of featured_property_details.cfm:
varParams={};
should be
var Params={};
[1] Personally, I would go with my solution regardless, but that's just how
I like to organize my code.
On 3/11/07, Rick Faircloth <[EMAIL PROTECTED]> wrote:
Ok... got rid of the "onClick" part of the INPUT...
Jake, used your submitHandler...
Made the changes to the rest of the code you suggested, Aaron.
Now, I don't get any errors, and the field validation is working,
but when I click the Calculate button, I don't get a result returned... in
this
case that would be the payment.
The MortgageCalculator code in the new version is repeated in the
beginning
of the script, then within the submitHandler... is this correct?
What adjustments should I make from here?
Thanks for the help!
Rick
Here's the new version of the code:
<script type="text/javascript">
// Define CalculateMortgage in the global scope so that it is always
accessible
function CalculateMortgage(){
var Params = {};
// select all inputs of type text
$("input:text").each(function(){
Params[$(this).attr("name")] = $(this).val();
}); // closes input:text function
// "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);
} // closes post function
); // closes ( after .post
} // closes { after CalculateMortgage = function() {
$.validator.defaults.debug = true;
$().ready(function() {
// validate Mortgage_Calculation_Form form fields on keyup
$("#MC_Form").validate({
errorPlacement: function(error, element) {
if(element.attr('id') == "Principal") {
error.appendTo("#principal_error");
}
else
if(element.attr('id') == "Interest") {
error.appendTo("#interest_error");
}
else
if(element.attr('id') == "Years") {
error.appendTo("#years_error");
}
},//closes errorPlacement function
focusInvalid: "false",
event: "keyup",
rules: {
Principal: {required: true,
number: true},
Interest: {required: true,
number: true},
Years: {required: true,
number: true}
},
messages: {
Principal: {required: "Please enter the
Principal.",
number: "Please enter a
number. Format: 255000 (No $ or , )"},
Interest: {required: "Please enter the
Interest Rate.",
number: "Please enter a
number."},
Years: {required: "Please enter the
Years.",
number: "Please enter a number."}
},
submitHandler:function(){
varParams={};
$("input:text").each(function(){
Params[$(this).attr("name")]=$(this).val();
})
$.post("Mortgage_Calculation.cfm",Params,function(data){
$("#Result").empty().append(data);
})
}
}) // closes the ) before the .validate bracket?
}); // closes the .validate bracket
</script>
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
--
Aaron Heimlich
Web Developer
[EMAIL PROTECTED]
http://aheimlich.freepgs.com
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
