CODEWITHSUNDEEP
jquery
matt
matt

Reputation: 821

Why is Jquery returning the wrong length?

I'm using this code to add an element to a form. Then I count the total number of elements with that class. However, Jquery .length returns the number of elements times two.

Any ideas what I'm doing wrong?

$(function () {
    function updateWeight() {
        var z = $("input.count").length;
        alert(z);
    }
    $("#addCatalogItem").autocomplete({
        source: function (request, response) {
            $.getJSON("inventory_auto_complete.php", {
                term: request.term,
                supplier_id: $('#supplier_id').val()
            }, response);
        },
        minLength: 2,
        select: function (event, ui) {
            var q = ui.item.product_id;
            $('#product_id').val(q);
            var r = ui.item.value;
            $('#product').val(r);
            var field = '<label>' + r + '</label><input class=\"count\" type=\"text\" value=\"\" name=\"field[' + q + ']\"/>';
            var $item = $("form");
            $(field).appendTo($item);
            updateWeight();
        }
    });
});

HTML

<form>
    <input type="hidden" id="supplier_id" value="1"/>
    <input id="addCatalogItem"/>
</form>

Upvotes: 0

Views: 3306

Answers (1)

Reigel Gallarde
Reigel Gallarde

Reputation: 65264

var $item = $("form"); would take all the form in the page. Maybe you got some other form somewhere in the page.

simple test case of Yi Jiang shows that your code should work perfectly.

Here's a test case that demonstrate same result as your problem.

My suggestion is you give the form an id then use it as the selector, var $item = $("#formID"); .

Upvotes: 2

Related Questions