Use itemSelector in internalCount initialization

Fixes a bug with an incorrect internalCount when the html does not have collection items as direct children of the collection, i.e:

<table data-form-widget="collection">
    <thead>...</thead>
    <tbody class="items">
        <tr class="item">...</tr>
        <tr class="item">...</tr>
    </tbody>
</table>

Author: net02

Resources/public/js/collections.js

@@ -37,10 +37,6 @@
      *                   objects behavior.
      */
     window.infinite.Collection = function (collection, prototypes, options) {
-        this.$collection = $(collection);
-        this.internalCount = this.$collection.children().length;
-        this.$prototypes = prototypes;
-
         this.options = $.extend({
             allowAdd: true,
             allowDelete: true,
@@ -52,6 +48,10 @@
             keepScripts: false
         }, options || {});
 
+        this.$collection = $(collection);
+        this.internalCount = this.$collection.find(this.options.itemSelector).length;
+        this.$prototypes = prototypes;
+
         this.initialise();
     };
 

Tests/Javascript/collection_tests.js

@@ -132,7 +132,7 @@
         equal(collection.internalCount, 4,
             'Internal count is incremented when adding');
     });
-    
+
     test("Keep scripts in prototype html", function() {
         var collection = setUpCollection('#markup .list-collection-with-prototype-scripts', {
             keepScripts: true
@@ -182,6 +182,12 @@
         equal(result.length, 1, 'addToCollection returned the row');
     });
 
+    test("Custom html structure", function() {
+        var collection = setUpCollection('#markup .list-collection-different-html-structure');
+        equal(collection.internalCount, 1,
+            'Internal count is correctly initialized');
+    });
+
     function setUpCollection(selector, options) {
         var $fixture = $('#qunit-fixture');
 

Tests/Javascript/test.html

@@ -55,6 +55,27 @@
             <a class="custom_remove_item">Remove</a>
         &lt;/div&gt;">Add</a>
     </div>
+    <div class="list-collection-different-html-structure">
+        <table class="collection">
+            <thead>
+                <tr>
+                    <th>Email</th>
+                    <th>Remove</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr class="item input-append" data-original>
+                    <td><input type="email" name="formb[0]" id="formb_0" /></td>
+                    <td><a class="custom_remove_item">Remove</a></td>
+                </tr>
+            </tbody>
+        </table>
+
+        <a class="add_item" data-customprototype="&lt;tr class=&quot;customitem input-append&quot;&gt;
+            &lt;td&gt;&lt;input type=&quot;email&quot; name=&quot;formb[__customname__]&quot; id=&quot;formb___customname__&quot; /&gt;&lt;/td&gt;
+            &lt;td&gt;&lt;a class=&quot;custom_remove_item&quot;&gt;Remove&lt;/a&gt;&lt;/td&gt;
+        &lt;/tr&gt;">Add</a>
+    </div>
 </div>
 
 </body>