$(".coral3-Multifield-item").each(function( index ) {}
this loop is not working for the newly added items.
$("coral-multifield").children("button[coral-multifield-add]").on("click", function() {
$(".coral3-Multifield-item").each(function( index ) {
console.log("add item");
})});
if I already have 2 items in my multifield when I open the dialog, then the above console log prints 2 times. Now if I Add a new item to the multifield (3rd item), the console log still works for the first 2 items only, though it should have worked for 3 times.
log:
add item
add item
Now if I add another item (4th item), then the log shows 3 times and twice but doesnt show for the 4th item:
add item
add item
add item
add item
add item
add item
Now if I save my dialog changes (total item=4) and open the dialog again, and Add a new item, this time console log prints 4 times and doesn't print for the the 5th item.
add item
add item
add item
add item
If there are no items when I open the dialog, and I add a new item, then the log doesn't print at all.
I need the run the loop everytime a new item is added.
Solved! Go to Solution.
Views
Replies
Total Likes
Adding the below code will execute only on button click and the loop also works as expected. This will run each time a new item is added i.e. each time you click on add button.
(function (document, $, ns) {
"use strict";
$(document).on("click", ".coral3-Button--secondary", function (e) {
e.stopPropagation();
e.preventDefault();
//Code from here
$(".coral3-Multifield-item").each(function (index) {
console.log("add item");
})
});
})(document, Granite.$, Granite.author);
Hope this helps!
Thanks!
Hi @Shaheena_Sheikh,
What are you trying to do with the multifield? It is recommended to use Models to handle the business logic.
Thanks,
Kiran Vedantam.
Views
Replies
Total Likes
Adding the below code will execute only on button click and the loop also works as expected. This will run each time a new item is added i.e. each time you click on add button.
(function (document, $, ns) {
"use strict";
$(document).on("click", ".coral3-Button--secondary", function (e) {
e.stopPropagation();
e.preventDefault();
//Code from here
$(".coral3-Multifield-item").each(function (index) {
console.log("add item");
})
});
})(document, Granite.$, Granite.author);
Hope this helps!
Thanks!
Views
Replies
Total Likes
Targeting the button element only should resolve it.
(function (document, $, ns) {
"use strict";
$(document).on("click", "button[coral-multifield-add]", function (e) {
e.stopPropagation();
e.preventDefault();
//Code from here
$(".coral3-Multifield-item").each(function (index) {
console.log("add item");
})
});
})(document, Granite.$, Granite.author);
Views
Replies
Total Likes
Views
Likes
Replies