Hello! There is a set of div elements with data-service_id and data-service_model attributes (model type). Each model type has a service id . This id can be repeated. I think it will be clearer with the code:

 <div class="item" data-service_id="1" data-service_model="cover">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="15" data-service_model="cover">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="15" data-service_model="cover">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="1" data-service_model="services">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="10" data-service_model="services">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="10" data-service_model="services">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="5" data-service_model="service-Option">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="8" data-service_model="service-Option">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="8" data-service_model="service-Option">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> 

I would like to display all duplicates and not duplicates in an array of type

 [{"service_model": "cover", "service_id": "15", "count": "2"}, {"service_model": "service", "service_id": "1", "count": "1"}, ... ] 

That is, count the number of identical in id and service_model , but also display the number even if one element.

I sampled all the elements and received .each every element, but how can I count the number of entries I can not understand (((

I would not like to choose specifically by id , since the parameter is changing. Tell me how best to do? Thank!

    2 answers 2

    We'll have to go through the data for such a structure twice, the first time to calculate the second for the desired conversion. Although it may suit you and just the first pass with the result in allItems .

     //считаСм количСство id для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ сСрвиса var allItems = {}; $('.item').each(function( index, el ) { var service_model = $(el).data("service_model"), service_id = $(el).data("service_id"); if(allItems[service_model] == undefined){ allItems[service_model] = {}; allItems[service_model][service_id] = 1; } else if(allItems[service_model][service_id] == undefined) { allItems[service_model][service_id] = 1; } else { allItems[service_model][service_id] += 1; } }) //ΠΏΡ€Π΅ΠΎΠ±Ρ€Π°Π·ΡƒΠ΅ΠΌ Π² Π½ΡƒΠΆΠ½ΡƒΡŽ структуру var mass = []; for (service in allItems){ for(id in allItems[service]){ mass.push({"service_model": service, "service_id": id, "count": allItems[service][id]}); } } console.log(mass) 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="item" data-service_id="1" data-service_model="cover">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="15" data-service_model="cover">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="15" data-service_model="cover">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="1" data-service_model="services">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="10" data-service_model="services">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="10" data-service_model="services">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="5" data-service_model="service-Option">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="8" data-service_model="service-Option">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="8" data-service_model="service-Option">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> 

      I can offer you the following algorithm:

      1. We create an associative array (object), where the keys are id (you can model), and the values ​​are objects from pairs: model and quantity. (sample code)

      2. We go through all the elements, we meet the next one - if its id is already in our array, then it works with the corresponding element, if not, we create it. Inside this element (the object pairs model - quantity) is similar: if there is such a model - increase the number by 1, if not - create a new pair model - quantity 1.

      3. We go around all the elements and get the quantities of all the options (you can do the sample by $(".item") )

      4. To get the array you want, you just need to loop around the values ​​of the resulting associative array object (2 nested loops)

      Here is an example of our associative array:

       { "1": { "cover":1, "services":1 }, "15":{"cover":2}, // ΠΈ Ρ‚Π°ΠΊ Π΄Π°Π»Π΅Π΅ } 

      Here is all the code that does it. You can copy it into .html file and view it in the browser. However, in essence, you are interested only in the <sctipt> tag <sctipt>

       <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(function () { var elems = $(".item"); var assoc = {}; // Π·Π°Π²Π΅Π»ΠΈ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚-массив elems.each(function (i, elem) { // ΠΏΠ΅Ρ€Π΅Π±ΠΎΡ€ if (!(elem.dataset.service_id in assoc)) { // Ссли Π΅Ρ‰Π΅ Π½Π΅ встрСчали Ρ‚Π°ΠΊΠΎΠ³ΠΎ id assoc[elem.dataset.service_id] = {}; // Π·Π°Π²Π΅Π΄Π΅ΠΌ Π½ΠΎΠ²Ρ‹ΠΉ элСмСнт } if (!(elem.dataset.service_model in assoc[elem.dataset.service_id])) { // Ссли Π½Π΅ встрСчали Ρ‚Π°ΠΊΡƒΡŽ модСль с Ρ‚Π°ΠΊΠΈΠΌ id assoc[elem.dataset.service_id][elem.dataset.service_model] = 1; // Π·Π°Π²Π΅Π΄Π΅ΠΌ модСль ΠΈ количСство Ρƒ Π½Π΅Π΅ 1 } else { assoc[elem.dataset.service_id][elem.dataset.service_model]++; // Ссли встрСчали, Ρ‚ΠΎ просто ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΠΌ количСство } $("#result").html(JSON.stringify(assoc)); // Π²Ρ‹Π²Π΅Π΄Π΅ΠΌ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ }); }); </script> </head> <body> <div class="item" data-service_id="1" data-service_model="cover">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="15" data-service_model="cover">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="15" data-service_model="cover">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="1" data-service_model="services">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="10" data-service_model="services">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="10" data-service_model="services">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="5" data-service_model="service-Option">Π Π°Π·Π½Ρ‹ΠΉ</div> <div class="item" data-service_id="8" data-service_model="service-Option">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div class="item" data-service_id="8" data-service_model="service-Option">ΠžΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΉ</div> <div id="result"></div> </body> </html> 
      • I have dynamic data and there is no known associative array. This is if I understood your version correctly) - ennet
      • @ennet so it should be done on the go assoc['1']={'cover':1} . do you always have in div only 2 properties that we work with data-service_id and data-service_model ? - RussCoder
      • yes only these 2 - ennet
      • @ennet updated the answer. JS - very dynamic, array object can be typed on the go. Convert to the desired structure, do it yourself, or look at Alex Krass - RussCoder