When I had this setup configured previously, the code below
was responsible for posting the form:
function CalculateMortgage(){
var Params = {};
$("input:text").each(function(){
Params[$(this).attr("name")] = $(this).val();
});
$.post("callpage_Validate_Mortgage_Inputs.cfm", Params,
function(data){
$("#Result").empty().append(data);
});
}
I'm not sure that it's firing now, however.
I even tried to put Jorn's Validation plug-in back in
and just use the submitHandler, but that didn't seem to
change anything...
I also tried on "onClick="CalculateMortgage" on the HTML Calculate submit
button.
Again...nothing seemed to happen.
I'm not sure about how the js and ColdFusion code is interacting... that
could be
the problem.
Rick
-----Original Message-----
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Karl Rudd
Sent: Thursday, March 15, 2007 11:18 PM
To: jQuery Discussion.
Subject: Re: [jQuery] Can't figure out how to put this all together...
CF is not something I'm familiar with but the FORM for your page
doesn't have an "action" attribute. It should be something like:
action="trial_field_validation.cfm"
I know that some browsers are fine with a blank action but no
action... Not sure how it's supposed to react to that.
Karl Rudd
On 3/16/07, Rick Faircloth <[EMAIL PROTECTED]> wrote:
> Yes... unfortunately.
>
> At first, I took the approach of complete client-side validation
> with jQuery and Jorn's Validation Plug-in and the final mortgage payment
> being computed by CF.
>
> Got that working perfectly, but thn I decided it would be better to use
> jQuery
> to validate the form fields (onblur) using CF, which I've accomplished.
>
> The problem now is, I can't figure out how to get my results back when
> submitting the form via the "Calculate" button.
>
> My "CalculatePayment" form doesn't seem to be doing anything and I can't
> figure out why.
>
> If I can just get the final calculation processed and returned to the
> calling page,
> I'll be finished with this technique...got any ideas?
>
> Rick
>
> -----Original Message-----
> From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
> Behalf Of Rey Bango
> Sent: Thursday, March 15, 2007 10:23 PM
> To: jQuery Discussion.
> Subject: Re: [jQuery] Can't figure out how to put this all together...
>
> Rick,
>
> Isn't this the same issue you've been working on for awhile now?
>
> Rey...
>
> Rick Faircloth wrote:
> > Hi, all...
> >
> > I'm trying to validate form inputs (individually onblur) and post a form
> > to calculate a mortgage payment.
> >
> > This method involves jQuery on the client side
> > and ColdFusion on the server side for validation.
> >
> > I've worked out the validation with no lingering problems.
> >
> > I can't figure out how to submit the form.
> >
> > Online demo:
> > http://bodaford.whitestonemedia.com/html/trial_field_validation.cfm
> >
> >
> > Here's the jQ I've got:
> >
> > <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("callpage_Validate_Mortgage_Inputs.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;
> >
> > $(document).ready(function(){
> >
> > $("#Principal").blur(function(){
> > $.post("callpage_Validate_Mortgage_Inputs.cfm",
> > {principal:$("#Principal").val()},
> > function (data)
{$("#Result_Principal").empty().append(data)
> > } ) });
> >
> > $("#Interest").blur(function(){
> > $.post("callpage_Validate_Mortgage_Inputs.cfm",
> > {interest:$("#Interest").val()},
> > function (data)
{$("#Result_Interest").empty().append(data)
> > }) });
> >
> > $("#Years").blur(function(){
> >
> >
$.post("callpage_Validate_Mortgage_Inputs.cfm",{years:$("#Years").val()},
> > function (data) {$("#Result_Years").empty().append(data)
})
> > });
> >
> > });
> >
> > </script>
> >
> >
> >
> > Here's my HTML:
> >
> > <Form id="Calculate_Mortgage" Name="Calculate_Mortgage">
> >
> > <table>
> >
> > <tr>
> > <td>
> > <Span id="Result_Principal"></span>
> > </td>
> > </tr>
> >
> > <tr>
> > <td>
> > Principal: <INPUT ID="Principal" Name="Principal"
> > Type="Text" Value="" Size="20" Class="TextInput01">
> > </td>
> > </tr>
> >
> > <tr>
> > <td>
> > <Span id="Result_Interest"></span>
> > </td>
> > </tr>
> >
> > <tr>
> > <td>
> > Interest: <INPUT ID="Interest" Name="Interest"
> > Type="Text" Value="" Size="20" Class="TextInput01">
> > </td>
> >
> > </tr>
> >
> > <tr>
> > <td>
> > <Span id="Result_Years"></Span>
> > </td>
> > </tr>
> >
> > <tr>
> > <td>
> > Years: <INPUT ID="Years" Name="Years" Type="Text"
> > Value="" Size="20" Class="TextInput01">
> > </td>
> > </tr>
> >
> > <tr>
> > <td>
> > Result:<Span ID="Result"></Span>
> > </td>
> > </tr>
> >
> > <tr>
> > <td>
> > <INPUT ID="Calculate" Name="Calculate"
Type="Submit"
> > Value="Calculate">
> > </td>
> > </tr>
> >
> >
> >
> > </table>
> >
> > </Form>
> >
> >
> > And here's my CF validation and Calculate Payment page:
> >
> >
> > <CFSET Principal_Error_Message = "">
> > <CFSET Interest_Error_Message = "">
> > <CFSET Years_Error_Message = "">
> >
> > <CFIF IsDefined("Form.Principal")>
> >
> > <CFIF Len(Trim(Form.Principal)) and Not
> > IsNumeric(REReplace(Form.Principal, "[.$,]","","All"))>
> >
> > <CFSET Principal_Error_Message = "Please enter a
> > valid dollar amount.">
> >
> > <CFELSEIF Not Len(Trim(Form.Principal))>
> >
> > <CFSET Principal_Error_Message = "Please enter a
> > value for the Principal.">
> >
> > </CFIF>
> >
> > <CFOUTPUT>#Principal_Error_Message#</CFOUTPUT>
> >
> > </CFIF>
> >
> >
> > <CFIF IsDefined("Form.Interest")>
> >
> > <CFIF Len(Trim(Form.Interest)) and Not
> > IsNumeric(REReplace(Form.Interest, "[.]","","All"))>
> >
> > <CFSET Interest_Error_Message = "Please enter a
> > valid Interest Rate.">
> >
> > <CFELSEIF Not Len(Trim(Form.Interest))>
> >
> > <CFSET Interest_Error_Message = "Please enter a
> > value for the Interest Rate.">
> >
> > </CFIF>
> >
> > <CFOUTPUT>#Interest_Error_Message#</CFOUTPUT>
> >
> > </CFIF>
> >
> >
> > <CFIF IsDefined("Form.Years")>
> >
> > <CFIF Not Len(Trim(Form.Years))>
> >
> > <CFSET Years_Error_Message = "Please enter the
> > number of years.">
> >
> > </CFIF>
> >
> > <CFIF Len(Trim(REReplace(Form.Years, "[0-9]","","All")))
> > and Not IsNumeric(REReplace(Trim(Form.Years),
> > "[0-9]","","All"))>
> >
> > <CFSET Years_Error_Message = "Please enter a valid
> > number for years.">
> >
> > </CFIF>
> >
> > <CFOUTPUT>#Years_Error_Message#</CFOUTPUT>
> >
> > </CFIF>
> >
> >
> > <CFIF IsDefined("Form.Principal")
> > and IsDefined("Form.Interest")
> > and IsDefined("Form.Years")>
> >
> > <CFIF Principal_Error_Message is ""
> > and Interest_Error_Message is ""
> > and Years_Error_Message is "">
> >
> > <CFSET Interest = Form.Interest/(12*100)>
> >
> > <CFSET
> > Payment=Form.Principal*(Interest/(1-(1+Interest)^-(Form.Years*12)))>
> >
> > <CFCONTENT
Reset="yes"><CFOUTPUT>#DollarFormat(Payment)#</CFOUTPUT>
> >
> > <CFELSE>
> >
> > <CFOUTPUT>0</CFOUTPUT>
> >
> > </CFIF>
> > </CFIF>
> >
> >
> > Why won't this work together?
> > How can I put it together?
> >
> > I'd love to use a submitHandler with Jorn's Validation plug-in
> > to prevent submission of the form as long as there are errors.
> > Is that possible?
> >
> >
> > Thanks for any help!
> >
> > Rick
> >
> >
> >
> >
> > _______________________________________________
> > jQuery mailing list
> > discuss@jquery.com
> > http://jquery.com/discuss/
> >
>
> _______________________________________________
> jQuery mailing list
> discuss@jquery.com
> http://jquery.com/discuss/
>
>
>
> _______________________________________________
> jQuery mailing list
> discuss@jquery.com
> http://jquery.com/discuss/
>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
