Well, I wouldn't go about it like you are ;) I would do everything on the client side - if the validation is done there you already have the boolean so it's a simple matter to disable an element. To answer your question directly, if you want to keep someone from submitting a form you either have to disable a button or kill the submit event itself. The button provides better user feedback so yes in my opinion it's a good idea.
In your case, since you're trying to learn ajax, I would say it's still worth learning how to pass complex data between the browser and server. It will help you immensely long term. JSON is more compact, but you have WDDX available to you in cf 4.5 and at the end of the day they both accomplish the same purpose. On Apr 18, 8:33 am, "Rick Faircloth" <[EMAIL PROTECTED]> wrote: > Let me back up and ask a question, Daemach, before I get much > deeper into trying to enable/disable a form button... > > Is it worth the extra work? Is it something you've used or do you > find it unnecessary? > > Rick > > -----Original Message----- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > > Behalf Of Daemach > Sent: Wednesday, April 18, 2007 12:28 AM > To: jQuery (English) > Subject: [jQuery] Re: Will this code enable & disable a submit button? > > You would need to create a structure with structNew() (http:// > builder.com.com/5100-6387-1049890.html), and add 2 nodes to it. Your > boolean result from the validation and the html you're returning now. > Then use cfwddx to convert the structure to wddx and return that > instead of the html you're returning now. Download the javascript > wddx.js from openwddx.org (extract the zip, read the docs - reference/ > javascript/ wddxdeserializer, include the wddx.js file) and change > your callbacks from this: > > function(data){ $("#Result").empty().append(data); } > > to something like this: > > function(data){ > var ds = new WddxDeserializer(); > var obj = ds.deserialize(data); > // now you have a javascript object (obj) that looks the same as the > cold fusion structure > if (obj.myBooleanValidateSuccessfulFromColdFusion == true) { > ("input:submit").removeAttr("disabled"); > } else { > ("input:submit").attr("disabled","disabled"); > } > $("#Result").empty().append(obj.myHTMLFromColdFusion); > } > > More info > here:http://livedocs.adobe.com/coldfusion/7/htmldocs/00001523.htm#1207113 > > On Apr 16, 7:48 pm, "Rick Faircloth" <[EMAIL PROTECTED]> wrote: > > > You would probably need to return a more complex object from the > > > server that contained a boolean in addition to your text. Structures > > > and JSON/WDDX work well for that kind of thing. You would then use > > > the boolean to trigger an if () statement. > > > Ummm.... could you elaborate a little on that? :o) > > > Rick > > > -----Original Message----- > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > > > Behalf Of Daemach > > Sent: Monday, April 16, 2007 10:14 PM > > To: jQuery (English) > > Subject: [jQuery] Re: Will this code enable & disable a submit button? > > > You would probably need to return a more complex object from the > > server that contained a boolean in addition to your text. Structures > > and JSON/WDDX work well for that kind of thing. You would then use > > the boolean to trigger an if () statement. I > > > On Apr 16, 6:19 pm, "Rick Faircloth" <[EMAIL PROTECTED]> wrote: > > > > Why are you declaring functions inside of your $(document).ready > > > > That was just a hangover from where I pulled that code... originally it > > was > > > part of Jorn's Validation plug-in... > > > > Since you've created an actual function called "toggleSubmit" to toggle > > the > > > button, > > > how would I trigger that function, say, after this code, *if* the data > > > return from the > > > post is a string? (In other words, the posted data was found to be > > > Invalid... > > > > How would it be combined with this code: > > > > $("#Principal").blur(function(){ > > > $.post("callpage_Validate_Mortgage_Inputs.cfm", > > > {principal:$("#Principal").val()}, > > > function (data) {$("#Result_Principal").empty().append(data) } ) > > }); > > > > Pseudo-code: > > > > If, after the post (above), the posted data was Invalid, toggle > > the > > > button to a > > > state of "disabled"... > > > > Rick > > > > -----Original Message----- > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > > > > Behalf Of Sean Catchpole > > > Sent: Monday, April 16, 2007 7:33 PM > > > To: jquery-en@googlegroups.com > > > Subject: [jQuery] Re: Will this code enable & disable a submit button? > > > > Rick, > > > > > onInvalid: function(form) { > > > Did you mean onInvalid = function(form){ > > > > Why are you declaring functions inside of your $(document).ready() ? > > > > Below I've attached working code, give it a try: > > > > ~Sean > > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" > > > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> > > > <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en"> > > > <head><title>Toggle Submit</title> > > > <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" > /> > > > <link rel="stylesheet" href="main.css" type="text/css" title='main' > > > media="screen" /> > > > <style type="text/css"> > > > * { margin:0px; padding:0px; } > > > img { border:0px; } > > > a { > > > outline:none; > > > display:block; > > > margin:14px; > > > font:14pt Calibri, Arial, sans-serif; > > > color:#000; > > > } > > > body { text-align:center; margin:30px; } > > > </style> > > > <script type="text/javascript" > > > src="http://jquery.com/src/jquery-latest.pack.js";></script> > > > <script type="text/javascript"> > > > > var enabled = true; > > > toggleSubmit = function(form){ > > > if(enabled) > > > $("input:submit",form).attr("disabled","disabled"); > > > else > > > $("input:submit",form).attr("disabled",""); > > > enabled = !enabled; > > > } > > > > </script> > > > </head><body> > > > <form> > > > <a href="javascript:toggleSubmit($('form'));">Toggle Submit</a> > > > <input type="submit" value="Submit"> > > > </form> > > > </body></html>
