Using checkbox value inside conditional statements in JavaScript

Question

I'm doing a questionnaire/survey using HTML. I need to get the value of the checkbox that is being checked. The questions on the next page(L2) will be based on the questions that is only checked on the checkbox when i click "submit".

I have a problem in getting and storing the value of the checkbox and using it later for an IF else-If else statement. Read a lot of online materials but I can't see any light from this. Any help will do... here is the code of the plain checkbox.

<html> 
    <head> 
    </head>
    <body>
        <script>
            var vg = document.getElementId("VideoGame").checked;
            var te = document.getElementId("Text").checked;
            var an = document.getElementId("Animals").checked;
            var sp = document.getElementId("Sports").checked;
            var lo = document.getElementId("Logo").checked;
        </script>
        <form action="L2.html">   
            Check the box if applicable: <br>
            <input type="checkbox" name="Q1" id="VideoGame"> The image is a Video Game. 
            <br>
            <input type="checkbox" name="Q1" id="Text"> The image contains text. <br>
            <input type="checkbox" name="Q1" id="Animals"> The image is about animals. 
            <br>
            <input type="checkbox" name="Q1" id="Sports"> The image is about sports. 
            <br>
            <input type="checkbox" name="Q1" id="Logo"> The image contains a logo. <br>
            <input type="submit" value="NEXT"> 
        </form>
    </body>
</html>

Are you running the code in localhost or server or just plain html? — Eng Cy, Jun 07 '17 at 09:38
i'm trying it first in plain html but planning to connect it to a server. — Cantfightfate, Jun 07 '17 at 10:17

score 0 · Answer 1 · answered Jun 07 '17 at 09:39

You can simply add onclick to every input-element:

<input type="checkbox" name="Q1" id="VideoGame" onclick="refreshValues()" />

The refreshValues()-function can look like this:

function refreshValues() {
    var vg = document.getElementId("VideoGame").checked;
    var te = document.getElementId("Text").checked;
    var an = document.getElementId("Animals").checked;
    var sp = document.getElementId("Sports").checked;
    var lo = document.getElementId("Logo").checked;
}

for better suggest with `onchange` instead of `onclick` for checkbox — prasanth, Jun 07 '17 at 09:45

daskel · Answer 2 · 2017-06-08T17:30:49.407

0

I would consider storing the data in either LocalStorage or SessionStorage and then retrieve it on the next page with localStorage.set('key', 'item') and localStorage.get('key');

https://developer.mozilla.org/en/docs/Web/API/Window/localStorage https://developer.mozilla.org/en/docs/Web/API/Window/sessionstorage

And if you need to store an object with multiple inputs consider using JSON stringify.

Storing Objects in HTML5 localStorage

edited Jun 08 '17 at 17:30

answered Jun 07 '17 at 09:40

daskel

88
1
10

1

I'm considering using session storage. thanks! sorry I don't have enough reputation to up vote this. :) – Cantfightfate Jun 08 '17 at 16:17

score 0 · Answer 3 · answered Jun 07 '17 at 09:41

0

Try to store user-answers in cookies, that might help. Ref: https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie

answered Jun 07 '17 at 09:41

Archelese · Answer 4 · 2017-06-07T09:50:39.067

0

if($("#your check box input field id").is(":checked")){
local jquery variable="yes";
}
else{
m11="no";
}

try this ,this is jquery code that will help u store the values in db.if u just wanna put conditions u can see the way i used it in condition. hope its helpfull. see this if u are still confused. saving values of toggle(yes or no) in database php. check box and toggle work same way.

edited Jun 07 '17 at 09:50

answered Jun 07 '17 at 09:42

Archelese

21
9

Using checkbox value inside conditional statements in JavaScript

4 Answers4