Two checkboxes with same value but diffrent code (Brainteaser)
I am trying to learn some HTML and JavaScript (from mostly using C#) and I got a test from a friend in making a small webstore.
I have some checkboxes for the different items, and the goal is if I combine different products, I get a discount. However there are two items with the same value that need different combinations for discounts. But the challange is that I am NOT ALLOWED to edit the html file.
Is there a way to tell these items apart with JavaScript? The only thing differing is the <h2>.
Again, I am very new to JavaScript, but I do have some knowledge of scripting, so if you got an solution, please do comment on what the function does so I can learn it better to implement in the code.
HTML and code:
Note that this is not the whole code, this is the only parts that I think is connected to each other for this question. If full script is wished for, I will make a pastebin for it.
$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>javascript jquery html
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
add a comment |
I am trying to learn some HTML and JavaScript (from mostly using C#) and I got a test from a friend in making a small webstore.
I have some checkboxes for the different items, and the goal is if I combine different products, I get a discount. However there are two items with the same value that need different combinations for discounts. But the challange is that I am NOT ALLOWED to edit the html file.
Is there a way to tell these items apart with JavaScript? The only thing differing is the <h2>.
Again, I am very new to JavaScript, but I do have some knowledge of scripting, so if you got an solution, please do comment on what the function does so I can learn it better to implement in the code.
HTML and code:
Note that this is not the whole code, this is the only parts that I think is connected to each other for this question. If full script is wished for, I will make a pastebin for it.
$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>javascript jquery html
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
4
Looks like plenty of JavaScript - where's the "Java"?
– freedomn-m
Nov 13 '18 at 15:10
Is there a way to tell the banana and apple "checkboxes" apart - no, because they are radio buttons... as they have the same name, only one will be checked. If you want to know which it is, then it would be (from the html posted)$("input.fruit:checked").closest("div.fruit").find("section").text()
– freedomn-m
Nov 13 '18 at 15:14
You need to realize one basic thing - Javascript is NOT Java. Those are 2 very different languages.
– pbialy
Nov 13 '18 at 15:15
I've edited the text to remove references to "Java". As @pbialy stated, they are not the same.
– freedomn-m
Nov 13 '18 at 15:16
Thanks alot! Did not know there was a differance in the two. I will keep that in mind for the future!
– Wingbtz
Nov 13 '18 at 16:51
add a comment |
I am trying to learn some HTML and JavaScript (from mostly using C#) and I got a test from a friend in making a small webstore.
I have some checkboxes for the different items, and the goal is if I combine different products, I get a discount. However there are two items with the same value that need different combinations for discounts. But the challange is that I am NOT ALLOWED to edit the html file.
Is there a way to tell these items apart with JavaScript? The only thing differing is the <h2>.
Again, I am very new to JavaScript, but I do have some knowledge of scripting, so if you got an solution, please do comment on what the function does so I can learn it better to implement in the code.
HTML and code:
Note that this is not the whole code, this is the only parts that I think is connected to each other for this question. If full script is wished for, I will make a pastebin for it.
$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>javascript jquery html
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
I am trying to learn some HTML and JavaScript (from mostly using C#) and I got a test from a friend in making a small webstore.
I have some checkboxes for the different items, and the goal is if I combine different products, I get a discount. However there are two items with the same value that need different combinations for discounts. But the challange is that I am NOT ALLOWED to edit the html file.
Is there a way to tell these items apart with JavaScript? The only thing differing is the <h2>.
Again, I am very new to JavaScript, but I do have some knowledge of scripting, so if you got an solution, please do comment on what the function does so I can learn it better to implement in the code.
HTML and code:
Note that this is not the whole code, this is the only parts that I think is connected to each other for this question. If full script is wished for, I will make a pastebin for it.
$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>$('body').on('click', '.fruit, .stuff1, .stuff2, .stuff3', update);
function update(){
let fruit = $('.fruit>input:checked').val();
fruit = parseInt(fruit);
fruit = fruit? fruit : 0;
let price = fruit + stuff1 + stuff2 + stuff3;
//If combined, get discount
//This is for the banana
//This should only apply for banana
if(fruit == 200 && stuff1 == 100)
{
price = price * 0.8;
$('#confirm').children('h2').text("You get 20% discount");
}
//This is an second discount in a else if ladder
//This is for apple
//This should only apply for apple
else if(fruit == 200 && stuff1 == 150)
{
price = price * 0.9;
$('#confirm').children('h2').text("You get 10% discount");
}
else
{
$('#confirm').children('h2').text("You dident get anny discount");
}
$('#price').val(price);
display(price);
}<div class="picker">
<div class="fruit">
<section>
<h2>Banana</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
<div class="fruit">
<section>
<h2>Apple</h2>
</section>
<input type="radio" name="fruit" value="200">
</div>
</div>javascript jquery html
javascript jquery html
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
edited Nov 13 '18 at 20:02
Nosajimiki
6701411
6701411
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
asked Nov 13 '18 at 15:08
WingbtzWingbtz
112
112
4
Looks like plenty of JavaScript - where's the "Java"?
– freedomn-m
Nov 13 '18 at 15:10
Is there a way to tell the banana and apple "checkboxes" apart - no, because they are radio buttons... as they have the same name, only one will be checked. If you want to know which it is, then it would be (from the html posted)$("input.fruit:checked").closest("div.fruit").find("section").text()
– freedomn-m
Nov 13 '18 at 15:14
You need to realize one basic thing - Javascript is NOT Java. Those are 2 very different languages.
– pbialy
Nov 13 '18 at 15:15
I've edited the text to remove references to "Java". As @pbialy stated, they are not the same.
– freedomn-m
Nov 13 '18 at 15:16
Thanks alot! Did not know there was a differance in the two. I will keep that in mind for the future!
– Wingbtz
Nov 13 '18 at 16:51
add a comment |
4
Looks like plenty of JavaScript - where's the "Java"?
– freedomn-m
Nov 13 '18 at 15:10
Is there a way to tell the banana and apple "checkboxes" apart - no, because they are radio buttons... as they have the same name, only one will be checked. If you want to know which it is, then it would be (from the html posted)$("input.fruit:checked").closest("div.fruit").find("section").text()
– freedomn-m
Nov 13 '18 at 15:14
You need to realize one basic thing - Javascript is NOT Java. Those are 2 very different languages.
– pbialy
Nov 13 '18 at 15:15
I've edited the text to remove references to "Java". As @pbialy stated, they are not the same.
– freedomn-m
Nov 13 '18 at 15:16
Thanks alot! Did not know there was a differance in the two. I will keep that in mind for the future!
– Wingbtz
Nov 13 '18 at 16:51
4
4
Looks like plenty of JavaScript - where's the "Java"?
– freedomn-m
Nov 13 '18 at 15:10
Looks like plenty of JavaScript - where's the "Java"?
– freedomn-m
Nov 13 '18 at 15:10
Is there a way to tell the banana and apple "checkboxes" apart - no, because they are radio buttons... as they have the same name, only one will be checked. If you want to know which it is, then it would be (from the html posted)
$("input.fruit:checked").closest("div.fruit").find("section").text()– freedomn-m
Nov 13 '18 at 15:14
Is there a way to tell the banana and apple "checkboxes" apart - no, because they are radio buttons... as they have the same name, only one will be checked. If you want to know which it is, then it would be (from the html posted)
$("input.fruit:checked").closest("div.fruit").find("section").text()– freedomn-m
Nov 13 '18 at 15:14
You need to realize one basic thing - Javascript is NOT Java. Those are 2 very different languages.
– pbialy
Nov 13 '18 at 15:15
You need to realize one basic thing - Javascript is NOT Java. Those are 2 very different languages.
– pbialy
Nov 13 '18 at 15:15
I've edited the text to remove references to "Java". As @pbialy stated, they are not the same.
– freedomn-m
Nov 13 '18 at 15:16
I've edited the text to remove references to "Java". As @pbialy stated, they are not the same.
– freedomn-m
Nov 13 '18 at 15:16
Thanks alot! Did not know there was a differance in the two. I will keep that in mind for the future!
– Wingbtz
Nov 13 '18 at 16:51
Thanks alot! Did not know there was a differance in the two. I will keep that in mind for the future!
– Wingbtz
Nov 13 '18 at 16:51
add a comment |
1 Answer
1
active
oldest
votes
When you use document.getElementsByName("fruit") in JavaScript it returns an array; so, document.getElementsByName("fruit")[0] returns the first radio and document.getElementsByName("fruit")[1] returns the second radio.
That said, you are using jQuery which is a JavaScript Framework. The syntax in jQuery to do the same thing is the slightly shorter $('[name="fruit"]').
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53283955%2ftwo-checkboxes-with-same-value-but-diffrent-code-brainteaser%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
When you use document.getElementsByName("fruit") in JavaScript it returns an array; so, document.getElementsByName("fruit")[0] returns the first radio and document.getElementsByName("fruit")[1] returns the second radio.
That said, you are using jQuery which is a JavaScript Framework. The syntax in jQuery to do the same thing is the slightly shorter $('[name="fruit"]').
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
add a comment |
When you use document.getElementsByName("fruit") in JavaScript it returns an array; so, document.getElementsByName("fruit")[0] returns the first radio and document.getElementsByName("fruit")[1] returns the second radio.
That said, you are using jQuery which is a JavaScript Framework. The syntax in jQuery to do the same thing is the slightly shorter $('[name="fruit"]').
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
add a comment |
When you use document.getElementsByName("fruit") in JavaScript it returns an array; so, document.getElementsByName("fruit")[0] returns the first radio and document.getElementsByName("fruit")[1] returns the second radio.
That said, you are using jQuery which is a JavaScript Framework. The syntax in jQuery to do the same thing is the slightly shorter $('[name="fruit"]').
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
When you use document.getElementsByName("fruit") in JavaScript it returns an array; so, document.getElementsByName("fruit")[0] returns the first radio and document.getElementsByName("fruit")[1] returns the second radio.
That said, you are using jQuery which is a JavaScript Framework. The syntax in jQuery to do the same thing is the slightly shorter $('[name="fruit"]').
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
answered Nov 13 '18 at 15:48
NosajimikiNosajimiki
6701411
6701411
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
add a comment |
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
jQuery is not a framework, it's just a library.
– pbialy
Nov 14 '18 at 12:12
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
Haha, I used to tell everyone that too, but so many people call it a framework, at some point I just gave up.
– Nosajimiki
Nov 14 '18 at 17:20
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53283955%2ftwo-checkboxes-with-same-value-but-diffrent-code-brainteaser%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
4
Looks like plenty of JavaScript - where's the "Java"?
– freedomn-m
Nov 13 '18 at 15:10
Is there a way to tell the banana and apple "checkboxes" apart - no, because they are radio buttons... as they have the same name, only one will be checked. If you want to know which it is, then it would be (from the html posted)
$("input.fruit:checked").closest("div.fruit").find("section").text()– freedomn-m
Nov 13 '18 at 15:14
You need to realize one basic thing - Javascript is NOT Java. Those are 2 very different languages.
– pbialy
Nov 13 '18 at 15:15
I've edited the text to remove references to "Java". As @pbialy stated, they are not the same.
– freedomn-m
Nov 13 '18 at 15:16
Thanks alot! Did not know there was a differance in the two. I will keep that in mind for the future!
– Wingbtz
Nov 13 '18 at 16:51