This is my first stackoverflow question. I am working on simple ajax code. The idea is that i have multiple checkboxes. When you click on checkbox, the jquery script needs to take the value of checkbox which is pressed and send ajax request.
The problem is that whatever checkbox i pressed the value is 321 which is the first checkbox value. I am new to javascript so sorry if question is stupid or something. Thank you.
</title>
</head>
<body>
<form action="">
<input id="321" class="checkbox" type="checkbox" name="vehicle" value="321" />I have a car<br>
<input id="123" class="checkbox" type="checkbox" name="vehicle" value="123" /> I have a bike<br>
<input type="submit" value="Submit"/>
</form>
<span></span>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var sum = 0;
$(".checkbox").change(function(){
if($(this).is(':checked')) {
var str = $(".checkbox").attr("value");
$.get("demo.php?item="+str, function(data, status){
sum = sum + parseInt(data);
$("span").html(sum);
});
}else{
var str = $(".checkbox").attr("value");
$.get("demo.php?item="+str, function(data, status){
sum = sum - parseInt(data);
$("span").html(sum);
});
}
});
});
</body>
</html>
