Правильно ли так вызывать функцию showProduct() внутри аджакс-запроса и уже внутри этой функции добавлять элемент в DOM?
Или надо разбить на две-три функции? Тогда не обойтись без Promise?
var app = document.getElementById('app');
function getProduct(id) {
var formData = new FormData();
formData.append('product_id', id);
var request = new XMLHttpRequest();
request.responseType = "json";
request.open('POST', '/api.php', true);
request.addEventListener('readystatechange', function() {
if (this.readyState == 4 && this.status == 200) {
var item = this.response;
showProduct(item);
}
});
request.send(formData);
}
function showProduct(item) {
var product = document.createElement('a');
product .href = 'product/' + item.href;
product .textContent = item.name;
product .addEventListener('click', product_rout);//функция роутинга, не
app.appendChild(product );
}
function product_rout {
...
}
//и сам вызов функции, вызывается по клику на карточку товара в списке товаров
getProduct(id);