Multiply Checkbox Value with Input Box Value - Jquery - php

Question

I am currently struggling to get the value I return from a checkbox to multiply with the value in the input box with jQuery.
I display a div when a checkbox is ticked to ask it for the quantity, thereafter I must multiply the quantity with the value of the checkbox.
Here is the current code:
$(document).ready(function () {
var sum = 0;
var qty = 0;
$("input[type=checkbox]").change(function () {
recalculateQty();
recalculateCheck();
if ($('#1').is(':checked')) {
$('#checked-1').show();
} else {
$('#checked-1').hide();
}
if ($('#2').is(':checked')) {
$('#checked-2').show();
} else {
$('#checked-2').hide();
}
if ($('#3').is(':checked')) {
$('#checked-3').show();
} else {
$('#checked-3').hide();
}
});
function recalculateQty() {
$('.qty').keyup(function () {
$('.qty').each(function () {
qty += parseInt(this.value, 10);
recalculateCheck();
});
});
}
function recalculateCheck() {
var sum = 0;
$("input[type=checkbox]:checked").each(function () {
sum += parseInt($(this).val());
});
$('.qty').keyup(function () {
$('.qty').each(function () {
qty += parseInt(this.value, 10);
});
});
$('#total').val(sum * qty);
}
});
<input type="checkbox" id="1" value="30" name="1" />
<input type="checkbox" id="2" value="60" name="2" />
<input type="checkbox" id="3" value="90" name="3" />
<div style="display:none;" id="checked-1">
<input type="text" name="product_1_qty" id="product_1_qty" placeholder="Quantity" class=" qty" value="0" />
</div>
http://jsfiddle.net/isherwood/9vRtJ/1/

Answer 1

You are trying to set an element value with total ID as a final result, but there is no such element in your html code. Just add this element in your html code (here i put another textbox):
<input type="text" id='total'>
Check out the Live demo for your fix
Or you can use better coding:(Read the comments) - Working DEMO
$(document).ready(function () {
var sum = 0;
var qty = 0;
$("input[type=checkbox]").change(function () {
if ($('#1').is(':checked')) {
$('#checked-1').show();
} else {
$('#checked-1').hide();
}
});
$('.qty').keyup(function () { // if user typed anyting in the Quantity
sum = parseInt($('#1').val()); // get checkbox value and change the data type to int
qty = parseInt($(this).val()); // get Quantity value and change the data type to int
//console.log(sum,qty);
if(sum && qty) { // if the values was not empty
$('#total').val(sum * qty); // show the result in the total element
} else { // if the values was empty
$('#total').val(''); // clear the result textbox
}
});
});