/    Sign up×
Community /Pin to ProfileBookmark

How do you retrieve the values of checkboxes once the user submits the form?

Copy linkTweet thisAlerts:
Jul 31.2008

In my website, the user can choose multiple choices from checkboxes in order to narrow down a long list. Simply a method of searching for what they want.

Right now I am using a form with the checkboxes and a submit button. What I would like to know is… how I can figure out which checkboxes the user chose, and send that information (in the form of variables) to a new page?

ie.
what type of movies do you like?
[*] Action [*] Horror [ ] Romance (Submit)

In submitting this I would like to use either of the following:
a variable for each checked item…
movieType1 = Action;
movieType2 = Horror;
or… an Array for the checked items
movieTypes = Array();
movieTypes = {“Action”,”Horror”};

Any ideas on how to acquire variables of this sort for use in another page?

to post a comment
HTML

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@ray326Jul 31.2008 — I'd use a name for each.
Any ideas on how to acquire variables of this sort for use in another page?[/QUOTE]The most common strategy is to save them in the session if your environment has that concept and AFAIK all the big ones do.
Copy linkTweet thisAlerts:
@sklinkauthorJul 31.2008 — No I mean... I know how to create variables in my code. I just don't know how to figure out which checkboxes the user has checked -> I need to create variables based on this. How can I figure out which ones they checked?
Copy linkTweet thisAlerts:
@ray326Aug 01.2008 — I.e. you don't know how forms work?

http://www.w3schools.com/html/html_forms.asp
Copy linkTweet thisAlerts:
@ThreeLetterSyndAug 01.2008 — Html first:
<i>
</i>&lt;form name="movietypes"&gt;
&lt;input type="checkbox" name="action" value="action"&gt; Action&lt;br&gt;
&lt;input type="checkbox" name="horror" value="horror"&gt; Horror&lt;br&gt;
&lt;input type="checkbox" name="romance" value="romance"&gt; Romance&lt;br&gt;
&lt;input type="submit" value="submit" onclick="check()"&gt;
&lt;/form&gt;


Now JS, it should work, but I haven't tested it:
<i>
</i>&lt;!--
function Check2(check,name)
{
if(check = TRUE)
{
MovieTypes.push(name);
}
else
{}
}
function Check()
{
action = document.getElementById("action").checked;
horror = document.getElementById("horror").checked;
romance = document.getElementById("romance").checked;
MovieTypes = Array();
check2(action,action);
check2(horror,horror);
check2(romance,romance);
}
--&gt;


the .checked() property has two values, TRUE and FALSE. the variables in the beginning are to ease up the code. Then the values are fed into another function, which adds them to the array if they are true.

If you have many, many checkboxes, you should turn "action", "horror" and whatever you have into numbers and create a loop. ?

Hope to have helped.
Copy linkTweet thisAlerts:
@ray326Aug 01.2008 — <input type="checkbox" name="action" value="action">

...

document.getElementById("action")

There's an element NAMED "action" but there's no element with the id "action".
Copy linkTweet thisAlerts:
@felgallAug 01.2008 — It would still work in Internet Exploder due to the bug in that abortion of a browser which in correctly maps names to ids. It would completely fail in real web browsers though.
Copy linkTweet thisAlerts:
@sklinkauthorAug 02.2008 — I needed to figure out which ones the user checked, not how to use forms, thanks anyways ray326. The "document.getElementById("action").checked;" was what I was looking for, obviously I should have posted this in the JScript section but I wasn't sure whether it could be done by simple HTML. Thanks for your help ThreeLetterSynd!
×

Success!

Help @sklink 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 6.2,
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: @meenaratha,
tipped: article
amount: 1000 SATS,

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

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...