We Keep Coding

How do I check two options at once in the option quiz?

I did it as you wanted and it still doesn't work as it should, if I don't check anything in the checkbox and give it an "evaluate test" so it will write me 1 point anyway, which is wrong. Some ideas?
function check(){
var question1 = document.querySelector('input[name="question1"]:checked');
var question2 = document.querySelectorAll('input[value="question2"]:checked', 'input[value="question2"]:checked');
var correct = 0;
if (question1 !=null && question1.value == " Červená, Zelená, Modrá") {
correct++;
}
if (question4 !=null &&question4.value == "Rastrová grafika","Vektorová grafika"){
correct++;
}
document.getElementById("number_correct").innerHTML = "Máš " + correct + " otázky/otázek správně.";
}
<form class="quiz">
<p style="font-weight: 900">V RGB modelu se jedná o jaké barvy?</p>
<input type="radio" class='question1' name="question1" value=" Červená, Zelená, Modrá"> Červená, Zelená, Modrá<br>
<input type="radio" class='question1' name="question1" value=" Červená, Zelená, Žlutá"> Červená, Zelená, Žlutá<br>
<input type="radio" class='question1' name="question1" value=" Černá, Fialová, Modrá"> Červená, Fialová, Modrá<br>
</form>
<form class="quiz">
<p style="font-weight: 900">Způsoby jakým počítače ukládají a zpracovávají obrazové informace se nazývají? (Vyber dvě možnosti)</p>
<input type="checkbox" class='question2' name="question4" value=" 3D grafika"> 3D grafika<br>
<input type="checkbox" class='question2' name="question4" value=" Vektorová grafika"> Vektorová grafika<br>
<input type="checkbox" class='question2' name="question4" value=" Fotografika"> Fotografika<br>
<input type="checkbox" class='question2' name="question4" value=" Rastrová grafika"> Rastrová grafika<br>
</form>
<br>
<div id="number_correct"></div>

question2 needs to be the result of a call to querySelectorAll, not just querySelector. It will then be a list of all the checked elements (querySelector only returns the first matched element, no matter how many match the selector.
You would need to loop the list and see what it contains. You need to verify that only two boxes were checked, and that they were the correct ones.
Also in your code, the question4 variable isn't defined, and input[value="question2"]:checked will never match anything - there's no checkbox with that value, and looking for the value makes no sense anyway. Also your question2 checkboxes randomly had "question4" as their name. I've corrected those issues and a couple of other minor things.
Something like this will work better:
function check() {
var question1 = document.querySelector('input[name="question1"]:checked');
var question2 = document.querySelectorAll('input[name="question2"]:checked');
var correct = 0;
if (question1 != null && question1.value == "Červená, Zelená, Modrá") {
correct++;
}
var q2answers = ["Rastrová grafika", "Vektorová grafika"];
var correctQ2NumAnswers = (q2answers.length == question2.length);
var correctQ2AnswersCount = 0;
question2.forEach(function(el) {
if (q2answers.includes(el.value)) correctQ2AnswersCount++;;
});
if (correctQ2NumAnswers == true && correctQ2AnswersCount == q2answers.length) correct++;
document.getElementById("number_correct").innerHTML = "Máš " + correct + " otázky/otázek správně.";
}
document.querySelector("#check").addEventListener("click", check);
<form class="quiz">
<p style="font-weight: 900">V RGB modelu se jedná o jaké barvy?</p>
<input type="radio" class='question1' name="question1" value="Červená, Zelená, Modrá"> Červená, Zelená, Modrá<br>
<input type="radio" class='question1' name="question1" value="Červená, Zelená, Žlutá"> Červená, Zelená, Žlutá<br>
<input type="radio" class='question1' name="question1" value="Černá, Fialová, Modrá"> Červená, Fialová, Modrá<br>
</form>
<form class="quiz">
<p style="font-weight: 900">Způsoby jakým počítače ukládají a zpracovávají obrazové informace se nazývají? (Vyber dvě možnosti)</p>
<input type="checkbox" class='question2' name="question2" value="3D grafika"> 3D grafika<br>
<input type="checkbox" class='question2' name="question2" value="Vektorová grafika"> Vektorová grafika<br>
<input type="checkbox" class='question2' name="question2" value="Fotografika"> Fotografika<br>
<input type="checkbox" class='question2' name="question2" value="Rastrová grafika"> Rastrová grafika<br>
</form>
<br>
<div id="number_correct"></div>
<button type="button" id="check">
Check Answers
</button>

on click mulitple input then show button for validation jquery

I have here three sections, how can I make the next button show up when all three sections have been clicked? If one of them is not clicked then the button with the class "hideme" is visible, if all of them are clicked then hide "hideme" and show the "third_step" button.
<input type="date" name="purchase_date">
<input type="radio" name="group" value="one">
<input type="radio" name="group" value="two">
<input type="radio" name="group" value="three">
<input type="radio" name="choice" value="yes">
<input type="radio" name="choice" value="no">
<a class="next hideme">Next</a><a class="next third_step">Next</a>
Anybody please help, I don't know where to start on this.

Here I have add a id on <form>. And give the input some class .
use Change event | Show() | hide()
Try this
<form id="myForm">
<input type="date" name="purchase_date" class="date">
<input type="radio" name="group" value="one" classs="group">
<input type="radio" name="group" value="two" classs="group">
<input type="radio" name="group" value="three" classs="group">
<input type="radio" name="choice" value="yes" classs="choice">
<input type="radio" name="choice" value="no" classs="choice">
<a class="next" style="display:none">Next</a>
</form>
<script>
$(document).ready(function(){
$('.group').on('change',function(){
$('.date').change();
});
$('.choice').on('change',function(){
$('.date').change();
});
$('.date').on('change',function(){
var date = $('.date').val();
var group = ($('input:radio[name=group]:checked').val() || 0);
var choice = ($('input:radio[name=choice]:checked').val() || 0);
if(date != '' && group != '' && group != 0 && choice != '' && choice != 0)
$('.next').show();
else
$('.next').hide();
});
});
</script>

$(document).on("click, change","input[name=group],
input[name=choice],
input[name=purchase_date] ",
function(){
var groupSelected = $("input[name=group]:checked").val();
var choiceSelected = $("input[name=choice]:checked").val();
var dateSelected = $("input[name=purchase_date]").val();
if(groupSelected === undefined ||
choiceSelected === undefined ||
dateSelected === undefined ||
dateSelected === "")
{
$(".next").toggleClass("hideme",true);
}
else{
$(".next").toggleClass("hideme",false);
}
});

Jquery - Iterate through all checked radio buttons

I have a form which is similar like the one below:
<form id="myForm">
Question 1:<br>
<input type="radio" name="question1" value="Yes"> Yes
<input type="radio" name="question1" value="No"> No
<br>
Question 2:<br>
<input type="radio" name="question2" value="Yes"> Yes
<input type="radio" name="question2" value="No"> No
<br>
Question 3:<br>
<input type="radio" name="question3" value="Yes"> Yes
<input type="radio" name="question3" value="No"> No
<br>
<input type="submit" value="Submit" name="submit">
</form>
I want to get all the selected radio button values from all the questions using jQuery and if all values is equal to "yes", it will alert success else it will alert fail.
This is the jQuery I wrote:
$(document).ready(function(){
$("#myForm input[type=radio]:checked").each(function() {
var value = $(this).val();
});
});

You can check if you ever get no with radio checked then result is fail else success.
Live Demo
result = "success";
$("#myForm input[type=radio]:checked").each(function() {
if(this.value == "No" && this.checked == true)
{
result = "fail";
return false;
}
});
alert(result);

$(document).ready(function(){
var val=1;
$("#myForm input[type=radio]:checked").each(function() {
if($(this).val()=="No")
{
val=2;
}
});
if(val==1)
{
alert("Success !!");
}
else{
alert("Fail ");
}
});

$(document).ready(function(){
var no_found=false;
$("#myForm").submit(function(){
$(this).find("input[type=radio]:checked").each(function() {
var value = $(this).val();
if(value == "No")
no_found=true;
});
if(no_found==false){
alert("Success");
}
else{
alert("Fail");
}
});
});

Use this code:
$(function() {
$('#myForm').on('submit', function(e) {
e.preventDefault();
var total = 0;
$('#myForm input[type="radio"]:checked').each(function() {
if ($(this).val() == 'Yes')
total++;
});
if (total == 3)
alert("Success");
else
alert("Fail");
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
Question 1:
<br>
<input type="radio" name="question1" value="Yes" checked>Yes
<input type="radio" name="question1" value="No">No
<br>Question 2:
<br>
<input type="radio" name="question2" value="Yes">Yes
<input type="radio" name="question2" value="No" checked>No
<br>Question 3:
<br>
<input type="radio" name="question3" value="Yes">Yes
<input type="radio" name="question3" value="No" checked>No
<br>
<input type="submit" value="Submit" name="submit">
</form>

Try this code
$("#myForm").submit(function(){
var check = "Yes";
$(this).find("input[type=radio]:checked").each(function() {
var value = $(this).val();
if(value == "No")
check = "No";
});
alert(check)
});

You may try this as well:
http://codepen.io/anon/pen/JGeLMx
$('#myForm input[type="submit"]').on('click', function(e) {
e.preventDefault();
var result = true;
$('input[type="radio"]').each( function() {
var radio = $(this)[0];
if ( radio.value === 'Yes' && radio.checked === false )
result = false;
});
if ( result ) {
alert( 'Success!' );
} else {
alert( 'Fail!' );
}
});
Iterated all the radio buttons and if a single check on 'No' or none is selected at all it will fail, otherwise, it would mean all 'Yes' are checked - success.

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function () {
$('input[type="radio"]').change(function () {
var iCountTotal;
var iCountCkedYes;
iCountTotal = $('input[type="radio"]').length/2;
iCountCkedYes = $('input[type="radio"][value="Yes"]:checked').length;
if (iCountTotal != iCountCkedYes) {
alert('fail')
}
else {
alert('success')
}
});
});
</script>
<body>
<form id="myForm">
Question 1:<br>
<input type="radio" name="question1" value="Yes" checked="checked"> Yes
<input type="radio" name="question1" value="No"> No
<br>
Question 2:<br>
<input type="radio" name="question2" value="Yes"> Yes
<input type="radio" name="question2" value="No" checked="checked"> No
<br>
Question 3:<br>
<input type="radio" name="question3" value="Yes"> Yes
<input type="radio" name="question3" value="No" checked="checked"> No
<br>
<input type="submit" value="Submit" name="submit">
</form>
</html>

Javascript - get the radio button index number

**I have a php page with an array of option like this... and I need to get by javascript **the index of the selected option. Above I put the code of the javascript that is not working... Any help will be appreciated!
<input type="radio" name="option[1]" value="1">
<input type="radio" name="option[1]" value="2">
<input type="radio" name="option[1]" value="3">
<input type="radio" name="option[1]" value="4">
<input type="radio" name="option[2]" value="1">
<input type="radio" name="option[2]" value="2">
<input type="radio" name="option[2]" value="3">
<input type="radio" name="option[2]" value="4">
<input type="radio" name="option[3]" value="1">
<input type="radio" name="option[3]" value="2">
<input type="radio" name="option[3]" value="3">
<input type="radio" name="option[3]" value="4">
...
Can anyone help me?
I am trying something like this but it didn´t work
<script type="text/javascript">
function validateForm(form) {
for (var i = 0; i < form.elements.length; i++ ) {
if (form.elements[i].type == 'radio') {
if (form.elements[i].checked == true) {
if (form.elements[i].value == 1 || form.elements[i].value == 6){
var comentario=document.getElementsByName('comentario[]'[i]);
var opcao = form.elements[i];
alert(clickedElm(opcao));
submitFlag = true;
if (comentario.value.length < 100){
submitFlag=false;
alert(i);
}
return submitFlag;
}
}
}
}
}
function clickedElm(element)
{
var index = 0;
for (var i = 0; document.forms[0].elements.length; i++)
{
if (document.forms[0].elements[i] == element)
{
index = i;
}
}
return index;
}
</script>

If I correctly understood the questuion, it can be solved like this:
$(document).on('change','input[type=radio]', function(){
alert($(this).prop('name').charAt(7));
});
Here is fiddle http://jsfiddle.net/Goodluck/ynkgr/

the name attribute is used for group the radio buttons, you have to use the id attribute to access the control asking if it's checked.
Example
<html>
<head>
</head>
<body>
<form id="frmTest">
<input type="radio" name="option[1]" id="option1-item1" value="1" >
<input type="radio" name="option[1]" id="option1-item2" value="2" >
<input type="radio" name="option[1]" id="option1-item3" value="3" >
<input type="radio" name="option[1]" id="option1-item4" value="4" >
<input type="radio" name="option[2]" id="option2-item1" value="1" >
<input type="radio" name="option[2]" id="option2-item2" value="2" >
<input type="radio" name="option[2]" id="option2-item3" value="3" >
<input type="radio" name="option[2]" id="option2-item4" value="4" >
<input type="radio" name="option[3]" id="option3-item1" value="1" >
<input type="radio" name="option[3]" id="option3-item2" value="2" >
<input type="radio" name="option[3]" id="option3-item3" value="3" >
<input type="radio" name="option[3]" id="option3-item4" value="4" >
</form>
<input type="button" onclick="validateForm(document.getElementById('frmTest'))" />
<script type="text/javascript">
function validateForm(form) {
for (var i = 0; i < form.elements.length; i++ ) {
if (form.elements[i].type == 'radio') {
if (form.elements[i].checked == true) {
if (form.elements[i].value == 1 || form.elements[i].value == 6){
var comentario=document.getElementsByName('comentario[]'[i]);
var opcao = form.elements[i];
alert(clickedElm(opcao));
submitFlag = true;
if (comentario.value.length < 100){
submitFlag=false;
alert(i);
}
return submitFlag;
}
}
}
}
}
function clickedElm(element)
{
return element.id;
}
</script>
</body>
</html>

You forgot to check the condition in this line:
(the loop in function clickedElm)
for (var i = 0; document.forms[0].elements.length; i++)
So, you enter in an infinite loop.
the correct line:
for (var i = 0; i < document.forms[0].elements.length; i++)

Radio Button Javascript

I have radiobuttons like below:
Apple
<input type="radio" id="one" name="apple" data-price="10" value="light"/> Light
<input type="radio" id="two" name="apple" data-price="20" value="dark" /> Dark
<input type="text" id="appleqty" name="appleqty" value="" />
Mango
<input type="radio" id="three" name="Mango" data-price="30" value="light"/> Light
<input type="radio" id="one" name="Mango" data-price="40" value="dark" /> Dark
<input type="text" id="Mangoqty" name="Mangoqty" value="" />
Pine Apple
<input type="radio" id="four" name="Pineapple" data-price="50" value="light"/> Light
<input type="radio" id="five" name="Pineapple" data-price="60" value="dark" /> Dark
<input type="text" id="Pineappleqty" name="Pineappleqty" value="" />
Grape
<input type="radio" id="six" name="Grape" data-price="70" value="light"/> Light
<input type="radio" id="seven" name="Grape" data-price="80" value="dark" /> Dark
<input type="text" id="Pineappleqty" name="Pineappleqty" value="" />
​
The radiobuttons are separated in a Group as (Apple,Mango,Pineapple,Grape).
I need to add the Price with the Quantity he needs.
Example:
If a user clicked Dark Apple in the radiobutton with 1 Qty the Price should be 20 and if the user changed the clicked Radio to the Light Apple radiobutton then the price should be 10 - 20(Previous Price If Checked) = 10 .
Is this possible using JavaScript?
My code that I have tried:
function upprice(ref)
{
var elname = ref.getAttribute("name");
var qtyname = elname+"qty";
var price = ref.getAttribute("proprice");
var qty = parseInt(document.getElementById(qtyname).value)
var newprice = parseInt(price*qty);
var olprice = parseInt(document.getElementById("orderpagepriceinstant").innerHTML);
var totalprice = parseInt(olprice+newprice);
document.getElementById("orderpagepriceinstant").innerHTML = parseInt(totalprice)
}

Your inputs should be something like:
<input type="radio" name="apple" value="10">Light
<input type="radio" name="apple" value="20">Dark
<input type="text" name="appleqty" value="">
You can put a click listener on the radio buttons and a change listener on the quantity to update the price:
<input type="radio" onclick="updatePrice(this)" ...>
<input type="text" onclick="updatePrice(this)" ...>
and the update function is:
function updatePrice(el) {
var priceEach, quantity, itemValue;
if (el.type == 'radio') {
priceEach = getRBValue(el);
quantity = el.form[el.name + 'qty'].value;
} else if (el.type == 'text') {
quantity = el.value;
priceEach = getRBValue(el.form[el.name.replace(/qty$/,'')]);
}
/*
code here to validate the value of quantity
*/
itemValue = quantity * priceEach;
/*
do something with itemValue
*/
alert(itemValue);
}
// Get the value of a radio button set
function getRBValue(el) {
var buttons;
// See if have been passed a button or button set (NodeList)
if (el.type == 'radio') {
buttons = el.form[el.name];
} else if (typeof el.length == 'number') {
buttons = el;
}
if (buttons) {
for (var i=0, iLen=buttons.length; i<iLen; i++) {
if (buttons[i].checked) {
return buttons[i].value;
}
}
}
}
</script>
The markup, you can also add a click listener to the form to do updates rather than on each radio button. You should also have a reset button so the user can clear the form.
<form ... >
<input type="radio" name="apple" value="10" onclick="updatePrice(this)">Light
<input type="radio" name="apple" value="20" onclick="updatePrice(this)">Dark
<input type="text" name="appleqty" value="" onchange="updatePrice(this)">
<br>
<input type="reset">
</form>

Here's a quick jQuery example: http://jsfiddle.net/FTscC/
(laptop dying, I'll elaborate when I can tomorrow!)