/    Sign up×
Community /Pin to ProfileBookmark

Checkbox problem

Copy linkTweet thisAlerts:
Jun 05.2005

I have created two set of checkboxes. In each set only one selection can be made. Depending on primary and secondary selection the user should be directed to a url corresponding to the combination of checkboxes.

I.E. One set could be REGION and the other could be TYPE OF MEDICAL SERVICES.

I am ok with the creation of the checkboxes however i don’t know how to link to URL’s.

?

to post a comment
JavaScript

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@phpnoviceJun 05.2005 — It would be easier if you used radio buttons for each set. That way, only one selection per set would be allowed automatically -- no additional code required. The following is just a demonstration:
[code=html]
<form method="POST" action="someurl" onsubmit="
var grp = this.elements['R1'];
var x, len = grp.length;
for (x=0; x<len; x++) {
if (grp[x].checked) break;
}
if (len<=x) {
alert('No region selected.');
grp[0].focus();
return false;
}
this.action += '?region=' + escape(grp[x].value);
grp = this.elements['R2'];
len = grp.length;
for (x=0; x<len; x++) {
if (grp[x].checked) break;
}
if (len<=x) {
alert('No service selected.');
grp[0].focus();
return false;
}
this.action += '&service=' + escape(grp[x].value);
alert(this.action); // <== remove after testing complete
return true;">

<div style="width:135px; float:left;">
<p style="text-align:right;">SERVICE&nbsp;REGION:<br>
North: <input type="radio" name="R1" value="North"><br>
South: <input type="radio" name="R1" value="South"><br>
East: <input type="radio" name="R1" value="East"><br>
West: <input type="radio" name="R1" value="West"></p>
</div>

<div style="width:150px;">
<p style="text-align:right;">TYPE&nbsp;OF&nbsp;SERVICE:<br>
Cardiac: <input type="radio" name="R2" value="Cardiac"><br>
Emergency: <input type="radio" name="R2" value="Emergency"><br>
Long-term&nbsp;Care: <input type="radio" name="R2" value="LongTerm"><br>
Maternity: <input type="radio" name="R2" value="Maternity"><br>
Pediatrics: <input type="radio" name="R2" value="Pediatrics"></p>
</div>

<p><input type="submit" name="B1" value="Submit"></p>

</form>
[/code]
I didn't include them in this demonstration (so as not to clutter up the demonstration), but field labels could also be added to allow ease of selecting a radio button by clicking on the descriptions of the radio buttons in addition to clicking on the radio buttons themselves.
Copy linkTweet thisAlerts:
@nitramauthorJun 06.2005 — Tks for the reply I will definitly use radio buttons instead. However depending on the R1 & R2 combination I would like to link to a URL, How can this be done?

i.e. R1 R2 Result

North Cardiac www.northernheart.com

North Emergency www.emergencyclinic.com

. . .

. . .

East Maternity www.MyNewBorn.com

etc......
Copy linkTweet thisAlerts:
@phpnoviceJun 06.2005 — The method I showed passes the selections to a single URL. For unique URL's you would have to create a 2-dimensional array and search that array for the defined URL:
<i>
</i>var links = new Array(
new Array("North", "Cardiac", "www.northerheart.com"),
new Array("North", "Emergency", "www.emergencyclinic.com"),
...
new Array("East", "Maternity", "www.MyNewBorn.com")
); // no comma after last entry above
Copy linkTweet thisAlerts:
@nitramauthorJun 07.2005 — Thanks in advance for your help.
Copy linkTweet thisAlerts:
@phpnoviceJun 07.2005 — This code:
<i>
</i>&lt;form method="POST" action="someurl" onsubmit="
var grp = this.elements['R1'];
var x, len = grp.length;
for (x=0; x&lt;len; x++) {
if (grp[x].checked) break;
}
if (len&lt;=x) {
alert('No region selected.');
grp[0].focus();
return false;
}
this.action += '?region=' + escape(grp[x].value);
grp = this.elements['R2'];
len = grp.length;
for (x=0; x&lt;len; x++) {
if (grp[x].checked) break;
}
if (len&lt;=x) {
alert('No service selected.');
grp[0].focus();
return false;
}
this.action += '&amp;service=' + escape(grp[x].value);
alert(this.action); // &lt;== remove after testing complete
return true;"&gt;

would be changed to this:
<i>
</i>&lt;form method="POST" action="someurl" onsubmit="
var grp = this.elements['R1'];
var x, len = grp.length;
for (x=0; x&lt;len; x++) {
if (grp[x].checked) break;
}
if (len&lt;=x) {
alert('No region selected.');
grp[0].focus();
return false;
}
[COLOR=Red] var region = grp[x].value;[/COLOR]
grp = this.elements['R2'];
len = grp.length;
for (x=0; x&lt;len; x++) {
if (grp[x].checked) break;
}
if (len&lt;=x) {
alert('No service selected.');
grp[0].focus();
return false;
}
[COLOR=Red] var service = grp[x].value;
var len = links.length;
for (x=0; x&lt;len; x++) {
if(links[x][0] == region
&amp;&amp; links[x][1] == service) {
break;
}
}
if (len&lt;=x) {
alert('No link found.');
return false;
}
this.action = links[x][2];[/COLOR]
alert(this.action); // &lt;== remove after testing complete
return true;"&gt;
×

Success!

Help @nitram spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...