Forums

Hi

I'm not sure if I'm going about this in the right way... on my form at http://jon-jackson.co.uk/web-design/site-maintenance.html I'd like to validate by having one of the maintenance options as required. So far I've tried by validating radio boxes with multiple fields etc but all I'm getting is multiple 'please choose from one of the options'-type messages.

Any suggestions please?

here's my code -

<style type="text/css" media="screen">
<!--
@import url("http://jon-jackson.co.uk/validation/style.css");
-->
</style>
<h1>Maintenance, administration and security of content management system (CMS) websites</h1>
<p>If you're running a CMS website, such as Joomla!, you'll need to keep up-to-date with maintenance and security.  Systems are constantly being improved to provide you and your users with better service and experiences and updated to ensure security against any new vulnerability. </p>
<fieldset>
<legend><strong>Monthly maintenance</strong></legend>
<ul>
  <li>System updates <br />
    System updates are released periodically, usually to enhance funtionality or to fix bugs. You can check if your system is up to date in the Administrator's Control Panel</li>
  <li>Security updates <br />
    Security updates are important to keep track of because they often involve issues of vulnerability... and we're all keen to reduce the risk of attack </li>
  <li>Browser checks <br />
    Browser technology is advancing at speed so it's essential to make sure your site works well for all the latest versions of browsers such as Firefox, Safari and Opera</li>
  <li>Google reports<br />
    Success with Google requires regular Analysis of your visitors to make sure that your website is performing at it's best. Reports provide information enabling your to correct or improve where necessary.</li>
</ul>
<p>
  <input TYPE="checkbox" NAME="monthly" VALUE="yes" id="monthly">
  <label id="monthly" for="monthly">Yes Please</label>
  , I'm interested in Monthly Maintenance </p>
</fieldset>
<fieldset>
<legend><strong>System admin services</strong></legend>
<ul>
  <li>System updates <br />
    As above</li>
  <li>Security updates <br />
    As above</li>
</ul>
<p>
  <input TYPE="checkbox" NAME="system" VALUE="yes" id="system">
  <label id="system" for="system">Yes Please</label>
  , I'm interested in System administration services </p>
</fieldset>
<fieldset>
<legend><strong>Security updates only</strong></legend>
<ul>
  <li>Security updates <br />
    As above</li>
</ul>
<p>
  <input TYPE="checkbox" NAME="security" VALUE="yes" id="security">
  <label id="security" for="security">Yes Please</label>
  , I'm interested in Security Update services</p>
</fieldset>
<fieldset>
<legend><strong>DIY</strong></legend>
<p>Of course, you can take care of administration, maintenance and security yourself.</p>
<p>
  <input TYPE="checkbox" NAME="diy" VALUE="yes" id="diy">
  <label id="diy" for="diy"></label>
  I'm quite happy to take care of administration, maintenance and security.</p>
</fieldset>
<p>Please complete the form  below to let me know about your requirements. After submission, if necessary, you will be contacted  to complete the process.</p>
<fieldset>
<legend><strong>Your Details</strong></legend>
<table border="0" cellspacing="0" cellpadding="4">
  <tr>
    <td><label1 for="name">Your Name:</label1>
       </td>
    <td><input type="text" name="name" size="40">
       </td>
  </tr>
  <tr>
    <td><label1 for="email">E-mail:</label1>
       </td>
    <td><input name="email" type="text" size="40">
       </td>
  </tr>
  <tr>
    <td><label1 for="dayphone">Day Phone:</label1>
       </td>
    <td><input type="text" name="day_phone" size="20">
       </td>
  </tr>
  <tr>
    <td><label1 for="evephone">Evening Phone:</label1>
       </td>
    <td><input type="text" name="night_phone" size="20">
       </td>
  </tr>
</table>
</fieldset>
<br />
<fieldset>
<legend><strong>When would you like the maintenance to begin?</strong></legend>
<br/>
<table border="0" cellspacing="0" cellpadding="4">
  <tr>
    <td><label2 for="month">
      Month</td>
    <td><select NAME="month" id="startmonth" size="1">
        <option SELECTED VALUE="none">Select Month</option>
        <option VALUE="Jan">Jan</option>
        <option VALUE="Feb">Feb</option>
        <option VALUE="Mar">Mar</option>
        <option VALUE="Apr">Apr</option>
        <option VALUE="May">May</option>
        <option VALUE="Jun">Jun</option>
        <option VALUE="Jul">Jul</option>
        <option VALUE="Aug">Aug</option>
        <option VALUE="Sep">Sep</option>
        <option VALUE="Oct">Oct</option>
        <option VALUE="Nov">Nov</option>
        <option VALUE="Dec">Dec</option>
      </select></td>
  </tr>
  <tr>
    <td><label2 for="year">Year</label2>
       </td>
    <td><select name="select" id="startyear" size="1">
        <option value="2008" selected="selected">2008</option>
        <option value="2009">2009</option>
        <option value="2009">Immediately</option>
      </select>
       </td>
  </tr>
</table>
</fieldset>
<p>My terms are published at <a href="http://jon-jackson.co.uk/index.php/terms-and-conditions.html">jon-jackson.co.uk/index.php/terms-and-conditions.html</a><br>
</p>
<input name="send it" type="submit" class="submit" id="send it" value="Submit" />

Hi JimmyHill,

This is tricky - it doesn't work well in the default set up but there is a working mod here

You'll need to make sure that you add ids and classnames to let the javascript find the input fields.

Bob

Very much appreciate your quick reply, Greyhead, and will try your solution.
Thanks

That all makes good sense and I see how it should work... I tried your solution (adding the script and the classes to the form) but unfortunately I think I'm probably missing something as it still doesn't work, so please could you suggest where I'm going wrong?

Picture3.png is a screeshot of the Validation tab in my Forms Manager - does that look about right?

Picture4.png is a screenshot of the form after one option is selected (you'll see that another is still being required)

Here's my code...

<style type="text/css" media="screen">
<!--
@import url("http://jon-jackson.co.uk/validation/style.css");
-->
</style>
<h1>Maintenance, administration and security of content management system (CMS) websites</h1>
<p>If you're running a CMS website, such as Joomla!, you'll need to keep up-to-date with maintenance and security.  Systems are constantly being improved to provide you and your users with better service and experiences and updated to ensure security against any new vulnerability. </p>
<h2>Website services that suit you...</h2>
<p>Select from the options below; monthly, system or security only. Send me your choice and we'll fix up a package that suits you.</p>
<fieldset>
<legend><strong>Monthly maintenance</strong></legend>
<p>Leave it all to me. You get on with what you do best - running your business.<br />
Monthly maintenance covers all the essentials of system and security administration - and keeps you up to date with browser and Google reports.</p>
<ul>
  <li><strong>System updates</strong> <br />
    System updates are released periodically, usually to enhance funtionality or to fix bugs. You can check if your system is up to date in the Administrator's Control Panel.</li>
  <li><strong>Security updates</strong> <br />
    Security updates are important to keep track of because they often involve issues of vulnerability... and we're all keen to reduce the risk of attack from the bad guys.</li>
  <li><strong>Browser checks</strong> <br />
    Browser technology is advancing at speed so it's essential to make sure your site works well for all the latest versions of browsers such as Firefox, Safari and Opera</li>
  <li><strong>Google reports</strong><br />
    Success with Google requires regular Analysis of your visitors to make sure that your website is performing at it's best. Reports provide information enabling you to correct or improve where necessary.</li>
</ul>
<p>
  <input TYPE="checkbox" NAME="monthly" VALUE="yes" class='validate-1req email' id="monthly">
  <label id="monthly" for="monthly">Yes Please</label>
  , I'm interested in Monthly Maintenance </p>
</fieldset>
<fieldset>
<legend><strong>System/security update services</strong></legend>
<p>System and security updates are released periodically - let me install and test them for you so that your site stays safe and sound.</p>
<ul>
  <li><strong>System updates</strong> <br />
  You can check if your system is up to date in the Administrator's Control Panel</li>
  <li><strong>Security updates </strong><br />
    Essential security updates installed to keep the hackers out.</li>
</ul>
<p>
  <input TYPE="checkbox" NAME="system" VALUE="yes" class='validate-1req email' id="system">
  <label id="system" for="system">Yes Please</label>
  , I'm interested in System administration services </p>
</fieldset>
<fieldset>
<legend><strong>Security updates only</strong></legend>
<p>Keep up to date with the essential security updates</p>
<ul>
  <li><strong>Security updates</strong> <br />
    Installed and tested</li>
</ul>
<p>
  <input TYPE="checkbox" NAME="security" VALUE="yes" class='validate-1req email' id="security">
  <label id="security" for="security">Yes Please</label>
  , I'm interested in Security Update services</p>
</fieldset>
<p>Please complete the form  below to let me know about your requirements. After submission, if necessary, you will be contacted  to complete the process.</p>
<fieldset>
<legend><strong>Your Details</strong></legend>
<table border="0" cellspacing="0" cellpadding="4">
  <tr>
    <td><label1 for="name">Your Name:</label1>
       </td>
    <td><input type="text" name="name" size="40">
       </td>
  </tr>
  <tr>
    <td><label1 for="email">E-mail:</label1>
       </td>
    <td><input name="email" type="text" size="40">
       </td>
  </tr>
</table>
</fieldset>

<p>My terms are published at <a href="http://jon-jackson.co.uk/index.php/terms-and-conditions.html">jon-jackson.co.uk/index.php/terms-and-conditions.html</a><br>
</p>
<input name="send it" type="submit" class="submit" id="send it" value="Submit" />

Hi jimmyhill,

This checks for any other inputs with classes the same as the id of the field with the validation class.

Here's your code with all the non form junk stripped out

<input TYPE="checkbox" NAME="monthly" VALUE="yes" class='validate-1req email' id="monthly">
<input TYPE="checkbox" NAME="system" VALUE="yes" class='validate-1req email' id="system">
<input TYPE="checkbox" NAME="security" VALUE="yes" class='validate-1req email' id="security">
<input type="text" name="name" size="40">
<input name="email" type="text" size="40">
<input name="send it" type="submit" class="submit" id="send it" value="Submit" />

You'll notice that *none* of your checkboxes has a class the same as the id of the field with the validation class, so it's working perfectly but checking nothing.
Try this intead.

<input type="checkbox" name="monthly" value="yes" class='security' id="monthly" >
<input type="checkbox" name="system" value="yes" class='security' id="system">
<input type="checkbox" name="security" value="yes" class='validate-1req security' id="security">
<input type="text" name="name" size="40">
<input name="email" type="text" size="40">
<input name="send it" type="submit" class="submit" id="send it" value="Submit" />

Bob

Hmmm, sorry to be such a dummy, Bob, but I'm still missing something here I think.

I tried your code but I get nothing required at all - http://jon-jackson.co.uk/web-design/site-maintenance2.html

Am I doing the right thing in the Validation tab? It seems that using the "12 Validate one required" is putting an extra class in the code, like this -

<input TYPE="checkbox" NAME="security" class="validate-one-required" VALUE="yes" class='validate-1req security' id="security">

Is that okay?

Hi JimmyHill.

Yes you are correct - to have this work you will need to set your validation classes manually. Sorry I forgot that.

Bob

So should I turn off Validation? I did try that but the effect is no validation.

How to set your validation classes manually?

Hi JimmyHill,

Simpler than that - turn validation ON in the validation tab. You can use the validation tab to set up any fields *except* those where you are adding extra values. The problem is that ChronoForms adds a second class attribute instead of merging the two and having two attributes screws stuff up. There was talk of fixing it but I don't thinkit's happened yet.

Bob

Thanks, Bob

I tried that (turning Validation On without listing fields) but I get no validation. So no joy I'm afraid.

Yopu did say it was tricky! Perhaps I'll just leave it that my users can select any or all of the options.

Hi JimmyHill,

you may do it using server side validation but the page will be reloaded!

Cheers
Max

Hi JimmyHill,

For each input - EITHER put the field name in the validation tab boxes OR add the calidation classes by hand - but not both on the same input.

Bob