Solved

form validation

Posted on 2006-06-22
3
161 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

PRTG Network Monitor: Intuitive Network Monitoring

Network Monitoring is essential to ensure that computer systems and network devices are running. Use PRTG to monitor LANs, servers, websites, applications and devices, bandwidth, virtual environments, remote systems, IoT, and many more. PRTG is easy to set up & use.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Troubleshoot mediawiki <-> ActiveDirectory authentication 2 131
PHP in Apache server 20 102
ColdFusion Rereplace 3 82
SSL Certificate for IIS7 Site 2 60
Meet the world's only “Transparent Cloud™” from Superb Internet Corporation. Now, you can experience firsthand a cloud platform that consistently outperforms Amazon Web Services (AWS), IBM’s Softlayer, and Microsoft’s Azure when it comes to CPU and …
Lease-to-own eliminates the expenditure of hardware replacement and allows you to pay off the server over time. Usually, this is much cheaper than leasing servers. Think of lease-to-own as credit without interest.
This video shows how to use Hyena, from SystemTools Software, to bulk import 100 user accounts from an external text file. View in 1080p for best video quality.
Although Jacob Bernoulli (1654-1705) has been credited as the creator of "Binomial Distribution Table", Gottfried Leibniz (1646-1716) did his dissertation on the subject in 1666; Leibniz you may recall is the co-inventor of "Calculus" and beat Isaac…

820 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