Problems, need help? Have a tip or advice? Post it here.
3 posts Page 1 of 1
Following the contact-form tutorial, CouchCMS seems to use its internal validation library for the front- and back-end. While I would like to use the server-side validation, for the frontend I normally use a jquery plugin, called .validate: http://jqueryvalidation.org/

It makes frontend form validating much leaner, because it nicely separates the concerns: I can modify and customize error message for each form in an external JavaScript-file, which keeps my HTML markup clean, for example:

Code: Select all
// Contact Form
$(document).ready(function () {

   $('#contactForm').validate({

      rules: {

         firstname: {
            required: true,
            minlength: 2,
            maxlength: 40
         },

         lastname: {
            required: true,
            minlength: 2,
            maxlength: 40
         },

         title: {
            maxlength: 40
         },

         company: {
            required: true,
            maxlength: 40
         },

         address1: {
            required: true,
            maxlength: 40
         },

         address2: {
            maxlength: 40
         },

         city: {
            required: true,
            maxlength: 40
         },

         state: {
            required: true,
            maxlength: 40
         },

         zipcode: {
            required: true,
            maxlength: 15
         },

         countries: {
            required: true
         },

         email: {
            required: true,
            email: true
         },

         phone: {
            required: true,
            number: true,
            rangelength: [7, 20]
         },

         message: {
            required: true,
            maxlength: 250
         }

      },

      messages: {

         firstname: {
            required: "Please enter your first name",
            minlength: jQuery.validator.format("At least {0} characters")
         },

         lastname: {
            required: "Please enter your last name",
            minlength: jQuery.validator.format("At least {0} characters")
         },

         company: {
            required: "Please enter your company name"
         },

         address1: {
            required: "Please enter your address"
         },

         city: {
            required: "Please enter your city"
         },

         state: {
            required: "Please enter your state"
         },

         zipcode: {
            required: "Please enter your zip code"
         },

         countries: {
            required: "Please select your country"
         },

         email: "Please enter a valid email",

         phone: {
            required: "Please enter a valid phone number",
            number: "Please enter a valid phone number",
            rangelength: jQuery.validator.format("Please enter between {0} and {1} digits.")
         },

         message: {
            required: "Please leave a message"
         }

      },

      // Normal submission
      submitHandler: function (form) {
         form.submit();
      }

   });

});



How would you implement this with CouchCMS to only use the server-side validation methods and show a success message if the from has been sent succesfully?

Can I simply remove the conditional validation tags? For example remove the following:

Code: Select all
<cms:if k_error_message>
     /* output error message here */
</cms:if >



Another question relates to AJAX form handling:

Does CouchCMS provide any interface to output success-messages via AJAX (and remove the whole form on success / just display the message)? Or is the conditional display of k_success the only way to give user feedback:

Code: Select all
<cms:if k_success >
   /*display message */
</cms:if>
How would you implement this with CouchCMS to only use the server-side validation methods and show a success message if the from has been sent succesfully?
Implement client side validation exactly the way you would with no Couch in the equation.

That is because your JQuery validation will take place in the browser and indeed Couch is completely out of the scene there.

Assuming your JQuery validations succeed, the form gets submitted to the server - it is now that Couch steps in to validate the submitted values server-side. It has no knowledge (nor is it in anyway concerned) with what you had used on the client-side.

Does CouchCMS provide any interface to output success-messages via AJAX (and remove the whole form on success / just display the message)? Or is the conditional display of k_success the only way to give user feedback:
Once again, Couch leaves this entirely up to you.
One strategy could be this -
create a separate template (say, named ajax.php) and put a copy of the form in it.
On the frontend, upon form submission, make an AJAX call to the mentioned template sending it the posted values. In ajax.php, use k_success or k_error to craft the return strings (could be JSON format). Use these values to show on the frontend.

The key above is to use the same fields in the ajax template as that on the normal one else the form might not validate.

Hope this helps.
That makes sense. Thanks... :)
3 posts Page 1 of 1