Solved

Simple Form Validation

Posted on 2004-08-23
4
151 Views
Last Modified: 2010-04-06
Hello

Could someone please tell me if the following is possible?

I have a form (see html below) and all i am trying to do is write a simple validation function to check the following:

1) If they check the check box and select the option "Completed" then a warning should be displayed.

The function should be good for a form that can contain only 1 row or many rows.

Thanks




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<form action="" method="get" name="tester">
  <table border="1">
    <tr>
      <td width="20%"><select name="select" size="1">
          <option>No Action</option>
          <option>In Progress</option>
          <option>Completed</option>
        </select>
      </td>
      <td width="80%"><input name="ckbox1" type="checkbox" value="">
        Option1 to select</td>
    </tr>
    <tr>
      <td><select name="select" size="1">
          <option>No Action</option>
          <option>In Progress</option>
          <option>Completed</option>
        </select>
      </td>
      <td><input name="ckbox2" type="checkbox" value="">
        Option2 to select</td>
    </tr>
  </table>
</form>
</body>
</html>
0
Comment
Question by:runcsmeduncs
4 Comments
 
LVL 5

Accepted Solution

by:
LindzK earned 25 total points
ID: 11869585
Hi,

below is a rework of your code, with added javascript to do the validation.  It will work for as many rows as you wish to add, all you need to ensure is that each checkbox has an id of chkboxN   where N = the row number, for example id="chkbox1".  Also give each selection box an id of selectN again where N = the row number, for example id="select1" or id="select2"

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="javascript">
  var warning = "This is the warning message";
 
  // function takes in the row number, so it knows what to validate
  function ValidateRow(RowNum)
  {
    // construct the id's of the object in the row
    var chkid = "chkbox" + RowNum;
      var selid = "select" + RowNum;
      
      // get the objects that you wish to validate
      var selobj = document.getElementById(selid);
      var chkobj = document.getElementById(chkid);
      
      // validate that the check box is checked, and the selection box says completed
      if (chkobj.checked && selobj.options[selobj.selectedIndex].text=="Completed")
      {
        window.alert(warning);
      }
  }
</script>

</head>
<body>
<form action="" method="get" name="tester">
  <table border="1">
    <tr>
      <td width="20%">
        <select id ="select1" name="select" size="1" onclick="ValidateRow(1)">
          <option>No Action</option>
          <option>In Progress</option>
          <option>Completed</option>
        </select>
      </td>
      <td width="80%">
        <input id="chkbox1" name="ckbox1" type="checkbox" value="" onclick="ValidateRow(1)">
        Option1 to select</td>
    </tr>
    <tr>
      <td>
        <select id="select2" name="select" size="1" onclick="ValidateRow(2)">
          <option>No Action</option>
          <option>In Progress</option>
          <option>Completed</option>
        </select>
      </td>
      <td><input id="chkbox2" name="ckbox2" type="checkbox" value="" onclick="ValidateRow(2)">
        Option2 to select</td>
    </tr>
  </table>
</form>
</body>
</html>
0
 
LVL 1

Expert Comment

by:cbelle13013
ID: 11870336
Does it have to be a javascript validation? Or can it be a PHP or ASP validation?
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

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

Most of the sites are being standardized with W3C Web Standards. W3C provides lot of web standard services to the web. They have the web specification, process and documentation for all the web standards. You can apply HTML, CSS and Accessibility st…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Viewers will learn about arithmetic and Boolean expressions in Java and the logical operators used to create Boolean expressions. We will cover the symbols used for arithmetic expressions and define each logical operator and how to use them in Boole…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

777 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