MachForm Community Forums » MachForm 2

1. fabiopao
   Member

   hi, I am trying to add a jquery validation plugin to my form, to make sure data entered in the fields are correct before user submits them: but in order to make this possible, I need to append a small class, say class="validate(required)" to the fields I want to validate. Is this possible, is there a file I can modify so that I can implement this function?
   I'd really appreciate any help

   Posted 14 years ago #
2. 

   redityo

   Hi,

   Basically you can add jQuery/javascript code in "view-functions.php" file. But it's depending on how the code works.

   Anyway could you show me more detail about this script ? or perhaps you can show me the url for example .

   ---

   MachForm Support

   Posted 14 years ago #

3. fabiopao
   Member

   Hi, thanks for the reply. I am trying to use this plugin: http://demos.usejquery.com/ketchup-plugin/#what on the form i have put on my website: http://www.quadrifogliorosso.com
   as you can see, the plugin needs to hook form elements with a specified class, and i don't know how to do it.
   Cheers

   Posted 14 years ago #
4. 

   redityo

   I think it's possible to use that plugin, but it will take a lot of modification. To do this, you need to edit "view-functions.php" file and in this example, I assume you'll use the validation for "single line text" field with element id 1 on form 2.
   Try to follow these steps :

   1. Copy all ketchup plugin to mahform js folder, then the path should be like this :

   /machform/js/ketchup-plugin

   2. Go to line 1833, you'll see this code :

   {$calendar_js}

   then put these code bellow that line

   <link rel="stylesheet" type="text/css" media="screen" href="js/ketchup-plugin/css/jquery.ketchup.css" />
   
   <script type="text/javascript" src="js/ketchup-plugin/js/jquery.min.js"></script>
   <script type="text/javascript" src="js/ketchup-plugin/js/jquery.ketchup.js"></script>
   <script type="text/javascript" src="js/ketchup-plugin/js/jquery.ketchup.messages.js"></script>
   <script type="text/javascript" src="js/ketchup-plugin/js/jquery.ketchup.validations.basic.js"></script>
   <script type="text/javascript">
   $(document).ready(function() {
     $('#form_2').ketchup();
   });
   </script>

   3. Go to line 40 for this code :

   $element_markup = <<<EOT

   then put this code above that line

   if ($_GET['id'] == 2 && $element->id == 1 ) {
   	$ketchup = ' validate(required) ';
   }

   4. Go to line 46, you'll see this code :

   <input id="element_{$element->id}" name="element_{$element->id}" class="element text {$element->size}" type="text" value="{$element->default_value}" />

   change to

   <input id="element_{$element->id}" name="element_{$element->id}" class="$ketchup element text {$element->size}" type="text" value="{$element->default_value}" />

   don't forget to change those id with yours

   ---

   MachForm Support

   Posted 14 years ago #

5. samersamer
   Member

   I tried to quickly integrate this but got the following error in the console:

   Error: $.fn.ketchup is undefined
   Source File: js/ketchup-plugin/js/jquery.ketchup.validations.basic.js
   Line: 86

   Posted 14 years ago #
6. 

   redityo

   Have you download "ketchup-plugin" and extract the file like in the step 1 ?

   ---

   MachForm Support

   Posted 14 years ago #

7. samersamer
   Member

   Yes, i kept getting an error, have you made this work with ketchup?

   -Sam

   Posted 14 years ago #

8. samersamer
   Member

   this is the error I keep getting,

   Error: $.fn.ketchup is undefined
   Source File: js/ketchup-plugin/js/jquery.ketchup.validations.basic.js
   Line: 86

   I have everything extracted and followed the exact instructions, I would be greatful if you could help, I will put the example up again here in a few mins.

   Posted 14 years ago #

9. samersamer
   Member

   I have made the exact changes above,

   My question is, what do I have to do in the above code to make it work with my form.

   Here is my form: http://www.virtualbrix.com/form-lead-management/embed.php?id=3

   I checked the Firefox console and I get this:

   Warning: Unknown property 'border-radius'. Declaration dropped.
   Source File: http://www.virtualbrix.com/form-lead-management/js/ketchup-plugin/css/jquery.ketchup.css
   Line: 13

   AND

   Error: $.fn.ketchup is undefined
   Source File: http://www.virtualbrix.com/form-lead-management/js/ketchup-plugin/js/jquery.ketchup.validations.basic.js
   Line: 86

   I would be grateful if you can help,

   -Sam

   Posted 14 years ago #
10. 

    redityo

    I think you didn't change the ID's from my example code. I see in your form, these code ;

    $(document).ready(function() {
      $('#form_2').ketchup();
    });

    should be changed to

    $(document).ready(function() {
      $('#form_3').ketchup();
    });

    because you're using the validation for form 3.
    However, if the problem still persist, is it possible to send me your FTP login into to :

    customer.service[at]appnitro.com

    I will help you to check it

    ---

    MachForm Support

    Posted 14 years ago #

11. samersamer
    Member

    sent you an email,

    -Samer

    Posted 14 years ago #

RSS feed for this topic

Reply

You must log in to post.