http://bassistance.de/jquery-plugins/jquery-plugin-validation/ :)



Rick Faircloth wrote:
> 
> Alright... now I've got this working very well.
> 
> The only problem I have now is validation.
> I normally submit a page back to itself, run some
> checks on the form values and throw up any errors messages
> before the form processes.
> 
> However, with the function "CalculateMortgage" below, I can't do that.
> 
> So I need some input on how to use jQuery for validation.
> 
> Is there some info somewhere that will walk me through that?
> 
> I need the following validation for form input:
> 
> Principal:  There must be an entry and it must be a number after
>                 all "$ , ." are taken out.
> 
> Interest:  There must be an entry and it must be a number after
>                a % sign which might be entered is taken out.
> 
> Years:  There must be an entry and the entry must be numerical.
> 
> Can anyone point me to some validation technique info that I could
> draw from?
> 
> Thanks!
> 
> Rick
> 
> 
> ===
> Calc page:
> 
> <script type="text/javascript" src="/js/jquery.js"></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("/path/to/yourdatapage.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>
> 
> <form name="f">
>       <table>
>               <tr>
>                       <td align="right"><strong>Principal:</strong></td>
>                       <td><input type="text" name="Principal"></td>
>               </tr>
>               <tr>
>                       <td align="right"><strong>Interest
> Rate:</strong></td>
>                       <td><input type="text" name="InterestRate"></td>
>               </tr>
>               <tr>
>                       <td align="right"><strong>Duration:</strong></td>
>                       <td><input type="text" name="Duration"></td>
>               </tr>
>               <tr>
>                       <td align="right"><strong>Result:</strong></td>
>                       <td><span id="Result"></span></td>
>               </tr>
>               <tr>
>                       <td align="right">&nbsp;</td>
>                       <td><input type="button" value=" Calculate "
> onClick="CalculateMortgage();return false;"></td>
>               </tr>
>       </table>
> </form>
> 
> ========
> 
> Page from which you are getting the data:
> 
> <cfsetting showdebugoutput="no"><cfset calc = form.Principal *
> form.InterestRate * form.Duration>
> 
> <cfcontent reset="yes"><cfoutput>#DollarFormat(calc)#</cfoutput>
> 
> 
> 
> Rick Faircloth wrote:
>> 
>> Hi, Daemach...
>> 
>> Thanks for the guidance, but unfortunately, I'm still using
>> CF 4.5, so CFC's are obviously not an option.  I plan to
>> upgrade this summer to CF 8 and catch up with everyone.
>> 
>> I was looking over your code, too... that complicated stuff!
>> (For someone just starting out, anyway...)  After looking over
>> the code, I can begin to see how it's being done... just wish
>> I could use AjaxCFC!
>> 
>> Thanks for your time and help!
>> 
>> Rick
>> 
>> -----Original Message-----
>> From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
>> Behalf Of Daemach
>> Sent: Wednesday, February 28, 2007 6:00 PM
>> To: discuss@jquery.com
>> Subject: Re: [jQuery] Need some guidance...
>> 
>> 
>> Hi Rick - 
>> 
>> This is one of those things I would use ajaxCFC for since it handles
>> serialization automatically.  The idea here is that you need to serialize
>> the values of your form fields, send them to the server, deserialize,
>> calculate and put the results into some kind of structure which gets
>> serialized again and returned to the browser for processing which starts
>> with deserializing.  Dealing with the serialization/deserialization
>> transparently is what makes ajaxCFC so great.
>> 
>> First, download ajaxcfc here: 
>> http://www.robgonda.com/blog/projects/ajaxcfc/download.cfm 
>> 
>> in the zip file drill down to ajaxCFC/branches/jquery/core/.  Put the
>> .cfc's
>> in some accessible folder on your web server, then copy everything inside
>> the /js folder to your javascript repository - I create a subfolder to
>> keep
>> it separate:  /js/ajaxCFC.  That's it for the install.
>> 
>> This sample code should get you started.  I stuck the ajax call directly
>> into the click event on the button, but you could put all of that in a
>> separate function and then call the function from the click event handler
>> if
>> you want.
>> 
>> ===========================
>> 
>> 
>> your html/cfm page with the calculator:
>> 
>> <script type="text/javascript" src="/js/jquery.js"></script>
>> <script type="text/javascript"
>> src="/js/ajaxCFC/jquery.AjaxCFC.js"></script>
>> 
>> <script type="text/javascript">
>>      // additional files
>>      $.AjaxCFC({require:'json'});
>>      // more additional files
>>      // $.AjaxCFC({require:'json,wddx,dDumper,log4j,DWRSyntax,blockUI'});
>> 
>>      // optional global settings
>>      // using these setters also automatically include dependencies
>>      
>>
> //$.AjaxCFCHelper.setAjaxLoadImage("#snort","/images/ajax_circleball.gif");
>>      $.AjaxCFCHelper.setDebug(false);
>>      $.AjaxCFCHelper.setBlockUI(false);
>>      $.AjaxCFCHelper.setUseDefaultErrorHandler(false);
>>      $.AjaxCFCHelper.setSerialization('json'); // json, wddx
>> 
>> $(document).ready( function() {
>> 
>>      // Add click event to button
>>      
>>      $('#ajaxit').click(function() {
>>              //create an object to pass to the cfc.  can also be an
>> array, simple
>> value, whatever you want.  Objects turn into cf structures.
>>              var obj = {firstVal:$('#firstVal').val(),
>> secondVal:$('#secondVal').val(),
>> thirdVal:$('#thirdVal').val(), randomstring:"why not"}
>>              //do ajax call
>>              
>>              $.AjaxCFC({
>>                      url: "/pathto/your.cfc", 
>>                      method: "calculate", 
>>                      data: obj, 
>>                      // can be an anonymous function, or the name of the
>> function that will
>> handle the return results.
>>                      success: showResults
>>                      });
>>      });
>> 
>> });
>> 
>> function showResults(data){
>>      // data will be whatever the cfc passed back in js format -
>> structure in
>> this case to make it easy.
>>      $('#result').val(data.results); 
>> 
>> }
>> 
>> </script>
>> 
>> firstVal: <input id="firstVal" name="firstVal" type="text"><br>
>> secondVal: <input id="secondVal" name="secondVal" type="text"><br>
>> thirdVal: <input id="thirdVal" name="thirdVal" type="text"> 
>> <input id="ajaxit" type="submit"  name="ajaxit" value="AjaxIt">
>> <hr>
>> 
>> result: <input id="result" name="result" type="text">
>> 
>> 
>> ================
>> 
>> Your cfc file should go in the same folder as ajax.cfc:
>> 
>> 
>> <cfcomponent extends="ajax">
>>      <!---
>> <cfscript>   
>>      setDebugMode('request');
>>      </cfscript>--->
>> 
>>      <cffunction name="calculate" output="no" access="private">
>>              
>>              <cfscript>
>>              obj = arguments;
>>              data = structNew();
>>              temp = obj.firstVal + obj.secondVal + obj.thirdVal;
>>              StructInsert(data, "results", temp);
>>              </cfscript>
>>              
>>              <cfreturn data>
>>      </cffunction>           
>> </cfcomponent>
>> 
>> 
>> 
>> Rick Faircloth wrote:
>>> 
>>> Hi, all.
>>> 
>>> I've just started using jQuery recently and now
>>> I'm trying to understand how to use it with AJAX
>>> and I just don't know enough about how it works
>>> to get started on a fairly simple app.  The sample app I've
>>> been tinkering with sends a URL variable for a User_ID
>>> using AJAX to a CF page, which runs a query and
>>> returns the info to the calling page and appends
>>> it to the body.  I'd like to send results back to the
>>> form fields, as well as the calculated result.
>>> 
>>> I just don't have a clue how to set this up.
>>> 
>>> I have a mortgage calculator and I want the user
>>> to be able to enter the principal, interest rate,
>>> and duration in years, then run a calculation on it
>>> and return the result.
>>> 
>>> I've set this up in a regular form that submits back
>>> to the page it's on and it works fine.  It's coded in CF.
>>> 
>>> I'd like to be able to calculate and return the results using AJAX.
>>> 
>>> I've worked some very simple code using AJAX (actually
>>> it was given to me), but I have no idea how to code for
>>> the above scenario.
>>> 
>>> Would anyone care to give this CF'er some guidance
>>> on creating this small jQuery/CF/AJAX app?
>>> 
>>> Thanks for any help!
>>> 
>>> Rick
>>> 
>>> _______________________________________________
>>> jQuery mailing list
>>> discuss@jquery.com
>>> http://jquery.com/discuss/
>>> 
>>> 
>> 
>> -- 
>> View this message in context:
>> http://www.nabble.com/Need-some-guidance...-tf3323366.html#a9240414
>> Sent from the JQuery mailing list archive at Nabble.com.
>> 
>> 
>> _______________________________________________
>> jQuery mailing list
>> discuss@jquery.com
>> http://jquery.com/discuss/
>> 
>> 
>> 
>> _______________________________________________
>> jQuery mailing list
>> discuss@jquery.com
>> http://jquery.com/discuss/
>> 
>> 
> 
> -- 
> View this message in context:
> http://www.nabble.com/Need-some-guidance...-tf3323366.html#a9244359
> Sent from the JQuery mailing list archive at Nabble.com.
> 
> 
> _______________________________________________
> jQuery mailing list
> discuss@jquery.com
> http://jquery.com/discuss/
> 
> 
> 
> _______________________________________________
> jQuery mailing list
> discuss@jquery.com
> http://jquery.com/discuss/
> 
> 

-- 
View this message in context: 
http://www.nabble.com/Need-some-guidance...-tf3323366.html#a9304429
Sent from the JQuery mailing list archive at Nabble.com.


_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

Reply via email to