Question

How do I compare the values in the text fields with the same data attribute in javascript?

<input type="text" name="a" id="a" data-common="candy" class="loop" value="2">
<input type="text" name="b" id="b" data-common="candy" class="loop" value="3">
<input type="text" name="c" id="c" data-common="ice" class="loop" value="7">
<input type="text" name="d" id="d" data-common="ice" class="loop" value="2">
<input type="text" name="e" id="e" data-common="water" class="loop" value="5">
<input type="text" name="f" id="f" data-common="water" class="loop" value="9">

What I want to do is to determine the higher value on each of the fields with common data attribute. If the common attribute is candy, then the program will compare the values 2 and 3.
My problem is I can’t think up of a good algorithm to even start coding. Can you give me an idea? What do I need to do first.

Answer 1

Here you go. The below code will find all the unique data-common attributes with max value.

Working demo

var dataAttributes = {}, attrValue, inputValue, $this;
$('input[data-common]').each(function() {
    $this = $(this);
    attrValue = $this.attr("data-common");
    inputValue = parseInt($this.val());
    if(!dataAttributes[attrValue]){
        dataAttributes[attrValue] = inputValue;
    }
    else{
        if(dataAttributes[attrValue] < inputValue){
            dataAttributes[attrValue] = inputValue;
        }   
    }
});
console.log(dataAttributes);