473,597 Members | 2,301 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

[Javascript] If checkbox C_1 is selected fields required?

263 Contributor
Hi all.

I have this simple form.

I need if checkbox C_1 is selected:

1) field name="n_1" is required and accept only numbers;
2) field name="n_2" is required and accept only numbers;

I need if checkbox C_2 is selected:

3) field name="n_3" is required and accept only numbers;
4) field name="n_4" is required and accept only numbers;

If checkbox not selected no required fields.

Can you help me?

Expand|Select|Wrap|Line Numbers
  1.  
  2. <html>
  3. <head>
  4.  
  5. <title>Popup</title>
  6.  
  7. <script language="javascript" type="text/javascript">
  8. <!--
  9.  
  10. function Go(){
  11.  
  12. var f=document.getElementById('id_form')
  13. var s='';
  14. var re = new RegExp("^[0-9]+$");
  15.  
  16. for(var i=0;i<f.elements.length;i++){
  17.  
  18. if(f.elements[i].value == ""){
  19. alert("KO!");
  20. f.elements[i].focus();
  21. return false;
  22.  
  23. }else if(f.elements[i].value.match(re)){
  24. alert("Only numbers!");
  25. f.elements[i].focus();
  26. return false;
  27.  
  28. }else{
  29.   s+=f.elements[i].value+',';
  30. }
  31.   alert("OK.");
  32.  
  33. }
  34.  
  35. //-->
  36. </script>
  37.  
  38. </head>
  39.  
  40. <body>
  41.  
  42. <form id="id_form" name="myform">
  43.  
  44. <div align="center">
  45. <table border="0" id="table1">
  46.  
  47. <td class=blub align="center"><input type="checkbox" name="C_1" value="ON"></td> 
  48. <td class=blub align="center"><input type="text" id="n_1" name="n_1" size="5"></td> 
  49. <td class=blub align="center"><input type="text" id="n_2" name="n_2" size="5"></td>
  50.  
  51. <td class=blub align="center"><input type="checkbox" name="C_2" value="ON"></td> 
  52. <td class=blub align="center"><input type="text" id="n_1" name="n_3" size="5"></td> 
  53. <td class=blub align="center"><input type="text" id="n_2" name="n_4" size="5"></td>
  54.  
  55. <td class=blub align="center"><a href="#" onclick="Go();">Go</a></td>
  56.  
  57. </tr>
  58.  
  59. </table>
  60.  </div>
  61.  
  62. </form>
  63.  
  64. </body>
  65. </html> 
Sep 5 '08 #1
37 4541
Dormilich
8,658 Recognized Expert Moderator Expert
you could (use two forms,) query the checkboxes with {checkbox_eleme nt}.checked and then select the forms/form elements to check for valid input.

regards

PS: you can omit the href attribute, if you style those anchors with css
Sep 5 '08 #2
viki1967
263 Contributor
you could (use two forms,) query the checkboxes with {checkbox_eleme nt}.checked and then select the forms/form elements to check for valid input.

regards

PS: you can omit the href attribute, if you style those anchors with css
mmm sorry but I dont understand....
Sep 5 '08 #3
Dormilich
8,658 Recognized Expert Moderator Expert
mmm sorry but I dont understand....
what don't you understand? the checkbox thing? well every checkbox element has a property called 'checked'. you can test if this property is true or false and depending on that you can do the validation.

regards
Sep 6 '08 #4
viki1967
263 Contributor
what don't you understand? the checkbox thing? well every checkbox element has a property called 'checked'. you can test if this property is true or false and depending on that you can do the validation.

regards
No... I don't understand: "use two forms"....
one example please?
Sep 6 '08 #5
Dormilich
8,658 Recognized Expert Moderator Expert
the two forms idea was only to point out that you need something to sort out which elements are checked with the first checkbox and which with the second. I've seen several possibilities
- group the elements by a class name (using later the getElementsByCl assName() function)
- group the elements inside a wrapper element that is accessible via its id (this can be any, including form, div, span, table,...)
* if you use form as wrapper you have access through {form}.elements
* if you use generic elements you have access through {element}.child Nodes
- assign an id to every input element and access them through a JS array that contains the appropriate ids

so, which one you choose depends on what you want to do with the form later and what you like best.

the two forms idea occurred to me because so it is possible to send only the required form.

regards

PS: as for the 'go' link
[HTML]// html
<span class="go" id="gocheck">Go !</span>

// css
.go {
text-decoration: underline;
color: _your_link_colo r_;
background-color: _your_link_back ground_color_;
}

.go:hover {
color: _your_link_colo r_on_hover_;
background-color: _your_link_back ground_color_on _hover_;
}

// javascript
var link = document.getEle mentById("goche ck");
link.addEventLi stener("click", Go, false); // standard
link.attachEven t("onclick", Go); // IE[/HTML]
Sep 6 '08 #6
Dormilich
8,658 Recognized Expert Moderator Expert
One more thought. you could also use parseInt() or parseFloat() to check for a number.

regards
Sep 6 '08 #7
acoder
16,027 Recognized Expert Moderator MVP
If I'm not mistaken, the requirement is that the two fields n_1/n_2 are mandatory if the first checkbox is checked and the other two if the 2nd one is checked which doesn't mean that they shouldn't be sent if they are filled. In other words, I don't think two forms would be a good idea, but, as I said, I may be mistaken.
Sep 6 '08 #8
Dormilich
8,658 Recognized Expert Moderator Expert
If I'm not mistaken, the requirement is that the two fields n_1/n_2 are mandatory if the first checkbox is checked and the other two if the 2nd one is checked which doesn't mean that they shouldn't be sent if they are filled. In other words, I don't think two forms would be a good idea, but, as I said, I may be mistaken.
yea, it all depends on how the form data shall be sent, but it was not specified in the original post, so this idea popped up in my mind.
Sep 6 '08 #9
viki1967
263 Contributor
sorry but I do not know this method....
Sep 6 '08 #10

Sign in to post your reply or Sign up for a free account.

Similar topics

2
1859
by: Cliff R. | last post by:
Hello, I have a form that has a few required fields and also an "agree to terms" checkbox that must be required. I have used Javascripts for both functions individually, but I need a little help in combining them. Can someone help me combine these two scripts so they both work on the same page, with <FORM METHOD=POST onSubmit="return checkrequired(this)" etc., checking for required fields and making sure the agree-to-terms button is...
0
2150
by: Just D | last post by:
Hi All, Does anybody know how to write the following code? I have a database table with a few columns including: ID , "Task" , ForceRun . I need to show the DataGrid on the ASPX page with these selected fields and allow user to click one or more CheckBox controls to activate this bit on the database table for a required ID. I have already added a template column to the DataGrid and I can get the
1
9462
by: kiran | last post by:
I cratee a form to meet the fallowing requirement. 1. If any node is selected the corresponding checkbox should be checked 2. If any checkbox is clicked the corresponding node should be selected 1st requirement is working ,but, 2nd requirement is not wokring properly. when I click a checkbox the coresponding node is being selected , but checkbox is not in checked mode. To get the check box in checked mode i have to click two times or...
4
3498
by: John Boy | last post by:
Hi, Can anyone help. This is really doing my nut in. 3 years ASP exp. and now doing .DOT which is a step in the wrong direction. Basically I am left with the code of a guy who has left. When I click a button on a pop-up window the javascript for that button click does a 'button.form.submit'. On the Server side there is a Button click event for this button, but for some reason it no longer fires. It worked fine before and everything...
3
5665
by: tom-co | last post by:
Hi. I am using this code so that when a checkbox is selected it populates two separate textfields with the word "No". <script type="text/javascript"><!-- function setField(what) { if (what.regonly.checked) what.share1.value = 'No'; else what.share1.value = '';
13
39422
by: Oleg Konovalov | last post by:
Hi, I am working on a web application which among other things uses DHTML, Java and Javascript. It populates web page based on the contents of the database (resultset), and next to each row there is a checkbox (v1) allowing to select that row for changes (e.g. delete, update, etc.) So we are creating an array of checkbox, correct ? Of course I have to check whether any of these checkboxes exist and if any of them got selected (checked)
3
2089
by: anthonybrough | last post by:
I have an asp page that has a form to collect user data in a form. when the user clicks submit the input is validated. If any fields are not acceptable the user clicks on a button to go back to the original form to correct the input. This all works fine until I try to incorporate a javascript to display a popup calendar which posts the selected date back to a field on the form. This script works fine in itself, however if the page is...
13
1833
by: DDragon | last post by:
ok here is the problem, i have to forms which have values i wish to be added together i can add together the values in one form all right but im having problems with adding the values of the other form to it... ill post the code for you to look at and try to explaine in detail what im trying to do. here is the code (HTML and Javascript so you get the whole picture): Javascript: var gen, lights; var lammount;
0
7971
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
7893
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
8276
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
1
8040
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8259
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
6698
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
5436
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
3889
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
1495
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.