'Need to find where in PHP/HTML.TWIG/JS my script is detecting input changes and updating shopping cart
Amateur web dev here working on some old legacy web app for a client.
A customer has a curated list of items they can order, and instead of an "add to cart", there is simply an input field you type a valid number into. As soon as you click off of the input field, it updates.
'<input type="number" class="quantity form-control" name="material'.$material->id.'" id="material'.$material->id.'" value="'.$value.'" />'
Could I please get some guidance or wisdom on some keywords to search for to find where this web app is detecting input field changes, checks if they are valid, and automatically adds it to the cart without refreshing the page?
I can't for the life of me find where it is happening.
What's throwing me off even more is this Twig add-on template engine that I'm not really familiar with.
It's a case where I am simply not knowledgeable enough to understand how all of these elements are communicating with each other.
If anyone needs more to post up more code, I'll gladly do it.
I figured I'd ask on here incase this question could be helpful for anyone in the future.
Thanks!
var materialbox = $(this).closest(".material");
var field = $(".form-control",materialbox);
var summaryContainer = $("#summaryContainer");
var summaryList = $(".summary-list",summaryContainer);
var materialid = field.attr("name");
var summaryElement = $("#summary_"+materialid);
// Select elements.
var theValue = ensureNumber(field);
// Create or update the Summary.
if ( theValue > 0 ) {
// Show summary.
summaryContainer.not(":visible").show();
$("button", summaryContainer).prop("disabled", false);
// Append item to cart.
if ( summaryElement.length == 0 ) {
var deleteButton = '<button type="button" class="btn btn-default btn-sm" title="Remove item from cart" onclick="removeCartItem(\'' + materialid + '\')"><span class="glyphicon glyphicon-trash"></span></button>';
var description = deleteButton + ' ' + $(".description", materialbox).html() + " -- " + $(".matcode",materialbox).text();
summaryElement = $(".list-group-item:first-child", summaryList).clone()
.append(description)
.attr("id", "summary_" + materialid)
.hide()
.appendTo(summaryList)
.show(500, function(){
$("#cartcontainer").affix('checkPosition');
})
.find('.quantity')
.text(theValue);
} else {
summaryElement.not(":visible").show(500);
$(".quantity",summaryElement).text(theValue);
}
} else if ( summaryElement.length > 0 ) {
// Remove existing summary because it's no longer needed.
summaryElement.hide(500, function() {
if ( $(this).siblings().filter(":visible").length == 0 ) {
summaryContainer.hide();
}
});
}
Edit: Added js code above that may be the event listener Jan was speaking of.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
