Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1538
  • Last Modified:

Validate a checkbox and corresponding text box.

I have a form with multiple checkboxes. the last checkbox has a corresponding textbox for a write in value.
I would like to make sure that the textbox can only be filled in if the corresponding checkbox is checked and if that same checkbox is then unchecked then the textbox is cleared out.

<form name="userlist" method="post"> 
<input name="user1" type="checkbox">User1
<input name="user2" type="checkbox">User2
<input name="1writein" type="checkbox">><input type="text" name="1wi" value="">
<input type="submit" name="submit">
</form>

Open in new window

0
tomfulton
Asked:
tomfulton
  • 4
  • 4
  • 3
  • +1
2 Solutions
 
HonorGodCommented:
Like this?
<html>
<head>
<title> Associated field </title>
<script language='JavaScript' type='text/javascript'>
  function checkIt( obj, id ) {
    var field   = document.getElementById( id );
    var checked = obj.checked;
    if ( field ) {
      if ( checked ) {
        if ( field.value != '' ) {
          alert( 'specified value: "' + field.value + '"' );
        }
      } else {
        field.value = '';
      }
    } else {
      alert( 'Specified field not found.  id="' + id + '"' );
    }
  }
</script>
</head>
 
<body>
<form name="userlist" method="post" action=''> 
  <input name="user1" type="checkbox">User1
  <input name="user2" type="checkbox">User2
  <input name="1writein" type="checkbox" onclick='checkIt(this,"1wi");'><input type="text" name="1wi" id="1wi" value="">
  <input type="submit" name="submit">
</form>
 
</body>
</html>

Open in new window

0
 
kevp75Commented:
you can do it client side, but what happens when us paranoid browsers decide to turn off javascript?

I would suggest you do this server-side.  


<%
dim frmField : frmField = request.querystring("1writein")
dim frmField2 : frmField2 = request.querystring("1wi")
if not isnull(frmField) or not isempty(frmField) or not(frmField = "") then
     if not isnull(frmField) or not isempty(frmField) or not(frmField = "") then
          'process the form here
     else
          'don't process it, throw a message at the user if you need to, etc
     end if
end if
%>

Open in new window

0
 
sybeCommented:
Hmm, interestingly enough I don't think that it is valid HTML to start the name of a form field with a numberic character. At least the code below does only work when the textfield does not start with a numeric character.

Secondly, on the server you should process the text field only when the checkbox is checked.

<%
If Request.Form("").Count
<form name="userlist" method="post">
<input name="user1" type="checkbox">User1
<input name="user2" type="checkbox">User2
<input name="1writein" type="checkbox" onclick="this.form.wi1.value=this.checked?this.form.wi1.value:'';this.form.wi1.disabled = !this.checked;"><input type="text" name="wi1" value="" disabled>
<input type="submit" name="submit">
</form>
 
===============
 
<%
If Request.Form("1writein").Count > 0 Then
    ' process textfield
End If
%>

Open in new window

0
Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

 
kevp75Commented:
yeah, that's what I was attempting, but I have a typo
<%
dim frmField : frmField = request.querystring("1writein")
dim frmField2 : frmField2 = request.querystring("1wi")
if not isnull(frmField) or not isempty(frmField) or not(frmField = "") then
     if not isnull(frmField2) or not isempty(frmField2) or not(frmField2 = "") then
          'process the form here
     else
          'don't process it, throw a message at the user if you need to, etc
     end if
end if
%>

Open in new window

0
 
tomfultonAuthor Commented:
Is this code from the last submission:
<%
dim frmField : frmField = request.querystring("1writein")
dim frmField2 : frmField2 = request.querystring("1wi")
if not isnull(frmField) or not isempty(frmField) or not(frmField = "") then
     if not isnull(frmField2) or not isempty(frmField2) or not(frmField2 = "") then
          'process the form here
     else
          'don't process it, throw a message at the user if you need to, etc
     end if
end if
%>

something I will put on the same page as the code for the form?  I wanted to do it on the client side if I could so I could catch the blank textbox and checked checkbox  before it is submitted.


Thank you
0
 
HonorGodCommented:
The first comment does exactly that.  It is on the client side, and demonstrates how to check not only the value of the radiobutton, but also clear the text field should the last radtiobutton be unchecked.

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_22989078.html#20369410
0
 
sybeCommented:
You probably want to do it both on client and on server side. Client side only works if people have javascript turned on, and no greasemonkey script running to overrule your script.

And yes, the first comment posted does the client side thing. Although it's a bit bit longer then what I suggested.
0
 
kevp75Commented:
sybe's correct (as previously stated...)

You would put that code on whatever page that is processing the form.  If your <form action is another page, it would go on that....unless you are doing a post-back in which case you would put it on the page the form is on...
0
 
tomfultonAuthor Commented:
HonorGod:
I put that code in an asp page by itself and my javascript is on but no alert came up and the textbox does not clear if the corresponding checkbox is unchecked.

so I looked into the server side possibility and

sybe:
Do I put your code in the same page as my form itself?
0
 
tomfultonAuthor Commented:
I don't know if I worded the problem different than what I need but in a set of checkboxes a user can select more than one choice but if the user wants the write-in then I want to verify that Both the write-in textbox and its corresponding checkbox is checked.

Thank you for looking at this
0
 
HonorGodCommented:
Strange.  I'm not familiar enough with asp so as to be able to understand why this would be the case.  If you add an alert to the function to prove that it is getting called, do you see it's output?

For example:


  function checkIt( obj, id ) {
    alert( 'checkIt()' );
    var field   = document.getElementById( id );
...

Open in new window

0
 
kevp75Commented:
what I posted for you will do the server side you need
0
 
tomfultonAuthor Commented:
Since the client side didn't work at first, I went with the server side solutions.
Thanks for the assistance.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 4
  • 4
  • 3
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now