count duplicate value from table column using jquery or javascript and pass to rowspan

前端 未结 4 1827
予麋鹿
予麋鹿 2020-12-22 14:58

I want to count duplicate value from table column and pass to rowspan using javascript or jQuery.

$(document).ready(fu         


        
4条回答
  •  攒了一身酷
    2020-12-22 15:11

    Here is an example using jQuery and I will give an explanation below it:

    $(document).ready(function() {
        let tr = $('tr');
        let vals = [];
    
        tr.each(function() {
    
            let td = $(this).find('td');
            td.each(function() {
                let val = $(this).text();
                if(isNaN(val)) {
                    return;
                }
                else {
                    let obj = _.find(vals, elt => elt.number === val);
                    if(obj) {
                        obj.count += 1;
                    }
                    else {
                        vals.push({
                            number: val,
                            count: 1
                        });
                    }
                }
            });
        });
    
        let finalArr = [];
    
        vals.forEach(function(elt) {
            let count = elt.count;
            let num = elt.number;
            $('tr').each(function() {
                let td = $(this).find('td');
                td.each(function() {
                    let val = $(this).text();
                    if($.inArray(val, finalArr) === -1 && !isNaN(val) && !$(this).hasClass('added') && val === elt.number) {
                        finalArr.push(val);
                        $(this).parent('tr').append(`${count}`);
    
                    }
                    else {
                        return;
                    }
                });
            });
        });
    
    });
    

    We can first create an array of unique values that are within each table data. If there is a unique value, we will add it to the vals array which will store objects representing the number that is unique and the "count" which is the number of times it occurs. If we see that number again during iteration, we will add to the count. After we are done iterating through each row we create a final array. We then iterate through our vals and retrieve the number of times it occurs and store it in the "count" variable. We then iterate through each table row and table data element again, and if the number is unique, we add that count the current count to parent element of the array we are currently doing iteration on if it is equal to the current number we are operating on in the vals array that stores the objects we created earlier. Lastly, we simply append a table data element to the parent table row of the element we are working with a rowspan that is equal to our count, and we can insert the value for how many times that number occurs. Of course, if you don't want to insert a value, you can simply keep the inner text of the table data element blank.

提交回复
热议问题