Solved

form validation

Posted on 2006-06-22
3
157 Views
Last Modified: 2013-12-24
I'm developing a coldfusion page where an employee can rate their knowledge of 50+ skills (Word, Excel, ASP, COBOL, etc) on a scale of 0-4 where 0 is no knowledge and 4 is a subject matter expert.  If a user has no knowledge, the employee keeps the default value of 0 (zero); however, if an employee rates their knowledge of 1,2,3, or 4, then the yearused needs to be required.  I was able to figure how to validate one instance, but when there are 50+ skills, I'm clueless.  

Criteria:
- If a radio button (ranking) is selected, the year must be selected; similarly, if a year is a selected, the radio button needs to be selected;
- If error, alert user to the issue as well as include the skill name of the issue
- I would like the focus to be returned to the yearused (since you can't see the focus on the radio button)

<!--- idea of table layout for the knowledge ranking system --->
<table>
<tr>
      <td>Skill Name</td>
      <td>0</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>Year Last Used</td>
  </tr>
<cfoutput query="getskills">
<tr>
      <td>#getSkills.skill_name#</td>
      <td><input name="RANKING_PL#ID#" type="radio" value="0"></td>
      <td><input name="RANKING_PL#ID#" type="radio" value="1"></td>
      <td><input name="RANKING_PL#ID#" type="radio" value="2"></td>
      <td><input name="RANKING_PL#ID#" type="radio" value="3"></td>
      <td><input name="RANKING_PL#ID#" type="radio" value="4"></td>
      <td><select name="yearused#id#" size="1">
            <option value="0">Not Applicable</option>
            <option value="2001">2001 or Earlier</option>
            <option value="2002">2002</option>
            <option value="2003">2003</option>
            <option value="2004">2004</option>
            <option value="2005">2005</option>                                                
            <option value="2006">2006</option>            
      </select>
            </td>
        </tr></cfoutput>
        <tr>
              <td colspan="7"><input type="submit"></td>
      </tr>
</table>
0
Comment
Question by:dl8453
  • 2
3 Comments
 
LVL 1

Author Comment

by:dl8453
ID: 16963216
This is a very similar to what I'm wanting to accomplish...
http://javascript.internet.com/forms/val-selection.html
0
 
LVL 15

Accepted Solution

by:
DanielSKim earned 200 total points
ID: 16964526
is this what you are looking for?

<form name="formName" onsubmit="return formValidationFunctionName()">
<table>
<tr>
     <td>Skill Name</td>
     <td>0</td>
     <td>1</td>
     <td>2</td>
     <td>3</td>
     <td>4</td>
     <td>Year Last Used</td>
  </tr>
<cfoutput query="getskills">
<tr>
     <td>#getSkills.skill_name#</td>
     <td><input name="RANKING_PL#ID#" type="radio" value="0" checked></td>
     <td><input name="RANKING_PL#ID#" type="radio" value="1"></td>
     <td><input name="RANKING_PL#ID#" type="radio" value="2"></td>
     <td><input name="RANKING_PL#ID#" type="radio" value="3"></td>
     <td><input name="RANKING_PL#ID#" type="radio" value="4"></td>
     <td><select name="yearused#id#" id="#getSkills.skill_name#" size="1">
          <option value="0">Not Applicable</option>
          <option value="2001">2001 or Earlier</option>
          <option value="2002">2002</option>
          <option value="2003">2003</option>
          <option value="2004">2004</option>
          <option value="2005">2005</option>                                        
          <option value="2006">2006</option>          
     </select>
          </td>
       </tr></cfoutput>
       <tr>
            <td colspan="7"><input type="submit"></td>
     </tr>
</table>
</form>

<script>

function getRankingInputs() {
      var frm = document.forms['formName'];
      var inputs = frm.getElementsByTagName('input');
      var i;
      var returnVal = new Object();
      var inputName;
      var skillId;
      
      for (i=0; i < inputs.length; i++) {
            inputName = inputs[i].name;
            if (inputName.substr(0,10).toUpperCase() == 'RANKING_PL' && inputs[i].value == '0') {
                  skillId = inputName.substr(10,inputName.length-10);
                  returnVal[skillId] = frm[inputs[i].name];
            }
      }
      
      return returnVal;
}

function getYearUsedSelects() {
      var frm = document.forms['formName'];
      var selects = frm.getElementsByTagName('select');
      var s;
      var returnVal = new Object();
      var selectName;
      var skillId;
      
      for (s=0; s < selects.length; s++) {
            selectName = selects[s].name;
            if (selectName.substr(0,8).toUpperCase() == 'YEARUSED') {
                  skillId = selectName.substr(8,selectName.length-8);
                  returnVal[skillId] = selects[s];
            }
      }
      
      return returnVal;
}

/* set as global variables so that the elements only have to be found once */
var rankingInputs = getRankingInputs();
var yearUsedSelects = getYearUsedSelects();


function formValidationFunctionName() {
      var r;
      var skillName;
      
      for (r in rankingInputs) {
            skillName = yearUsedSelects[r].id;
            if (!rankingInputs[r][0].checked && yearUsedSelects[r].value == 0) {
                  alert('You need to specify the year last used for ' + skillName);
                  yearUsedSelects[r].focus();
                  return false;
            } else if (rankingInputs[r][0].checked && yearUsedSelects[r].value != 0) {
                  alert('You need to specify a skill level for ' + skillName);
                  yearUsedSelects[r].focus();
                  return false;            
            }
      }
      
      return true;
}


</script>
0
 
LVL 1

Author Comment

by:dl8453
ID: 16964992
This was SPOT ON PERFECT!  I was able to just drop it in and it worked on the first attempt.  
0

Featured Post

Free Gift Card with Acronis Backup Purchase!

Backup any data in any location: local and remote systems, physical and virtual servers, private and public clouds, Macs and PCs, tablets and mobile devices, & more! For limited time only, buy any Acronis backup products and get a FREE Amazon/Best Buy gift card worth up to $200!

Join & Write a Comment

This is a guide to setting up a new WHM/cPanel Server to be used for web hosting accounts. It is intended for web hosting company administrators and dedicated server owners. For under $99 per month (considering normal rate of Big Data Cetnters like …
If you don't have the right permissions set for your WordPress location in IIS, you won't be able to perform automatic updates. Here's how to fix the problem.
Sending a Secure fax is easy with eFax Corporate (http://www.enterprise.efax.com). First, Just open a new email message.  In the To field, type your recipient's fax number @efaxsend.com. You can even send a secure international fax — just include t…
This demo shows you how to set up the containerized NetScaler CPX with NetScaler Management and Analytics System in a non-routable Mesos/Marathon environment for use with Micro-Services applications.

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now