Watch out for this CFFORM issue

I’m working on converting a site to Model-Glue. During the conversion I was copying over a page that had two forms on it. One made use of CFFORM, the other was really just a button to let you link to another page.

For some reason - whenever I hit the button on the second form, the validation for the CFFORM would fire. That didn’t make sense. The validation should only apply to the first form.

Here is a subset of the code. See if you can spot something odd before I reveal what the problem was:

<cfform name="Volunteer" action="http://www.cnn.com" method="post"> <table cellspacing="0" > <tr class="odd"> <td><cfinput name="FirstName" type="text" size="10" tabindex="1" maxlength="24" required="yes" message="Please enter a valid First Name." validate="regular_expression" pattern="^[a-z A-Z-]+$"></td> <td><input name="Action" type="submit" value="Add" tabindex="4"></td> </tr>

</cfform>

<cfoutput> </table>

<form name=”Finished” action=”http://www.yahoo.com” method=”post”> <div class=”submit”> <input name=”Action” type=”submit” value=”Yahoo”> </div> </form> </cfoutput> </code>

See it yet? Notice the placement of the closing HTML table tab versus the closing CFFORM tag. When rendered out, this resulted in something like so:

<form ...> <table> </form> </table>

Now while I can’t imagine why that would mess with validation, when I fixed the order of the tags the validation worked correctly. Form one did it’s thing, and form two simply let me load up a new URL.

Raymond Camden's Picture

About Raymond Camden

Raymond is a developer advocate. He focuses on JavaScript, serverless and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA https://www.raymondcamden.com

Comments