Make calculations in checkboxes with Javascript

Question

I have a list of checkboxes in Twitter Bootstrap in the following format:

<form method='post' class="form-horizontal" id="myform">
   <input type="checkbox" attr1="2" attr2="4" prodname="product1"> product1
   <input type="checkbox" attr1="5" attr2="1" prodname="product2"> product2
   <input type="checkbox" attr1="1" attr2="7" prodname="product3"> product3
   ....
   ....
   <button type="submit" class="btn btn-success pull-right">Calculate</button>
</form>

The user will choose some of the products (not all of them) and click the submit button to see the result in base of the following formula:

finalvalue = sum_of_attr1/total_num_checked + 10*best_prod_attr1 - best_prod_attr2

This means that I have to find the sum of all the attr1 of the checked boxes and how many are checked and then try every checked box to see which of them will give the maximum value. Then I will update a div with the final value and the prodname of the best product.

I don't want to do this in server-side and I want to try it with Javascript/JQuery. Any thoughts?

What do you mean by *" then try every checked box to see which of them will give the maximum value"*?? — T J, Sep 12 '14 at 12:02
@TJ if you see the formula, the `best_prod` could be one of the checked boxes. I have to try everyone of the checked boxes to see which of them will give the biggest final value on the formula. — Sfinos, Sep 12 '14 at 12:05

score 2 · Accepted Answer · edited May 23 '17 at 11:49

2

For the "best" calculation: see this SO question: jQuery: How to calculate the maximal attribute value of all matched elements?

For the number of checked checkboxes: How to count check-boxes using jQuery?

EDIT AFTER COMMENTS and better expression of the expected behaviour:

var sumAttr1 = null;
var bestProductName = null;
var maxScorePart = null;

// Browse each checked input to get the sum of attr1 and get the best product
$('input:checkbox:checked').each(function() {
    var valueAttr1 = parseInt($(this).attr('attr1'));
    var valueAttr2 = parseInt($(this).attr('attr2'));

    // Cumulate attr1 for final calc
    sumAttr1 += valueAttr1;

    // Check best prod
    var currentScorePart = 10 * valueAttr1 - valueAttr2;
    if(currentScorePart > maxScorePart) {
        maxScorePart = currentScorePart;
        bestProductName = $(this).attr('prodname');
    }
});

var maxScore = sumAttr1 / $('input:checkbox:checked').length + maxScorePart;
alert('Best product = ' + bestProductName + '\r\nBest product score = ' + maxScore);

See working sample: http://jsfiddle.net/5whctawh/

edited May 23 '17 at 11:49

Community

1
1

answered Sep 12 '14 at 12:12

Nicolas R

13,812
2
28
57

I don't want to find the maximum attribute, but the checkbox that may give the maximum finalValue. Since the formula uses both attributes, it isn't necessary that the biggest will be the best. – Sfinos Sep 12 '14 at 12:16
Ok that was the intent of my edit... I think we (at least T J and I) do not clearly understand: you want to find which product (in the checked products?) has the highest finalValue when we replace its attr in the formula of finalValue? – Nicolas R Sep 12 '14 at 12:17
Exactly! Sorry for the inconvenience. English is not my mother language and it is easy to make mistakes. – Sfinos Sep 12 '14 at 12:20
So do we have to check each product or each checked product? – Nicolas R Sep 12 '14 at 12:21
Each checked product only. – Sfinos Sep 12 '14 at 12:24
Ok I work on it. Do you agree that if the formula is `finalvalue = sum_of_attr1/total_num_checked + 10*best_prod_attr1 - best_prod_attr2`, the difference between scores is only due to `10*best_prod_attr1 - best_prod_attr2`? The 1st part is equal between all checked item – Nicolas R Sep 12 '14 at 12:25
Yes. Actually, the first part is the average of the attr1 of all the checked boxes and the second is the attributes of the one that will give the maximum value to the formula. – Sfinos Sep 12 '14 at 12:29
1

Yes. Almost finished, I will provide a jsfiddle to check – Nicolas R Sep 12 '14 at 12:30
Edited answer! Let me know if I understood the right behaviour – Nicolas R Sep 12 '14 at 12:34

Make calculations in checkboxes with Javascript

1 Answers1