CODEWITHSUNDEEP
jquery
Dario
Dario

Reputation: 15

cant get a total of several inputs in Jquery

im having problems with making a total of all my inputs. when I echo the class in html it is just changing the variable and not making a sum of all my inputs. 

 <script>$(document).ready(function(){
    var prijs = 0;
    var cas = 0;
    var voeding = 0;
$("input[name='behuizing']").click(function() {
        prijs -= cas
        cas = parseInt(this.id);
        prijs += cas;
        $('.test').html(prijs);
    });
    $("input[name='voeding']").click(function() {
        price -= voeding
        voeding = parseInt(this.id);
        price += voeding;
        $('.test2').html(price);})
;});
</script>

<body>
<p class="test"></p>
</body>

the class test needs to make a total of al the selected radiobuttons. these are my forms.

 <Form name ="form" Method ="Post" ACTION ="radiobutton.php">
    <Input type = 'Radio' Name ='behuizing' value= '1' id='25'>Sharkoon VS3-S red </br>
    <Input type = 'Radio' Name ='behuizing' value= '2' id='25'>Sharkoon VS3-S blue </br>
    <Input type = 'Radio' Name ='behuizing' value= '3' id='25'>Sharkoon VS3-S green </br>

Cooler Master G600 EU Cooler Master B700

Upvotes: 0

Views: 51

Answers (2)

Scelesto
Scelesto

Reputation: 795

Try this:

HTML:

<body>
    <Form name ="form" Method ="Post" ACTION ="radiobutton.php">
            <Input type = 'Radio' Name ='behuizing' value= '1' data-price='25'>Sharkoon VS3-S red </br>
            <Input type = 'Radio' Name ='behuizing' value= '2' data-price='25'>Sharkoon VS3-S blue </br>
            <Input type = 'Radio' Name ='behuizing' value= '3' data-price='25'>Sharkoon VS3-S green </br>
            <Input type = 'Radio' Name ='voeding' value= '1' data-price='65'>Cooler Master G600 EU</br>
            <Input type = 'Radio' Name ='voeding' value= '2' data-price='70'>Cooler Master B700 </br>
    </Form>
    <p class="test"></p>
</body>

Javascript:

var b = 0,v = 0
$("input[name='behuizing'],input[name='voeding']").change(function() {
        b=$("input[name='behuizing']:checked");
        v=$("input[name='voeding']:checked");
        b=b.length==0?0:parseInt(b.attr('data-price'));
        v=v.length==0?0:parseInt(v.attr('data-price'));
        $('.test').html(b+v);
});

http://jsfiddle.net/uE5Gf/3/

Upvotes: 0

AstroCB
AstroCB

Reputation: 12367

I would agree with @undefined in that you need unique IDs, because that's what IDs are for. If you need to group elements together, use classes.

But aside from that, I see two issues: you haven't defined price and you don't have the test2 class that you reference in your second handler in your HTML.

Demo

Upvotes: 1

Related Questions