Trying to iterate in a item cause: "Uncaught TypeError: Cannot read
property 'length' of undefined"
I'm trying to iterate through a element using this code:
$.each(element, function(index, item) {
...
});
I check element type by executing this command $.type(element) in Chrome
console and I got "object" as output. I check also what has element inside
using this command element and got this as output:
[<input type=​"text" name=​"input_color_5[]​"
class=​"field_color" data-selector=​"color"
data-id=​"color_5" placeholder=​"Color">​]
Also I tried all this command from console:
element.val() -> return ""
element.attr('data-selector') -> return "color"
element.attr('data-id') -> return "color_5"
If I use instead this other code:
element.each(function(index, item) {
...
});
Then the error turn on:
Uncaught TypeError: Cannot call method 'each' of undefined
This is how I construct element object:
function getDivId() {
var inputValues = [];
inputValues.push($('#choices_picker input[type="text"]'));
return inputValues;
}
And I call later in this way:
$('#choices_picker').on("click", "#create-variation", function(e) {
var parent_id = $(this).closest("section").attr("id");
var element = getDivId(parent_id);
$('#variations_holder').show();
$('#variations_holder').html("");
html = "";
iterateChoices("", element[0], element.slice(1), 0);
$('#variations_holder').append(html);
});
And finally this is the function iterateChoices():
function iterateChoices(row, element, choices, counter) {
if ($.isArray(choices)) {
$.each(element, function(index, item) {
if (counter === 0) {
row = '<label>UPC:</label> <input style="display:
inline-block" type="text" value="" name="pupc[]" />';
row += '<label>Precio:</label> <input style="display:
inline-block" type="text" value="" name="pprice[]" />';
row += '<label>Cantidad:</label><input type="text"
style="display: inline-block" value="" name="pqty[]" />';
}
if (choices.length > 0) {
iterateChoices(row + '<input disabled="disabled" value="'
+ item.value + '"></div>', choices[0], choices.slice(1),
counter + 1);
}
});
} else {
html_temp = "";
element.each(function(index, item) {
html_temp += row + '<input value="' + item.value + '"
disabled="disabled"><br>';
});
html += html_temp;
}
}
Then I ask myself, isn't element a object since I got the error? What is
wrong or what I'm doing wrong?
No comments:
Post a Comment