The script produces an Uncaught SyntaxError error: Unexpected end of input indicates that an error in this line var arr = JSON.parse (resp) [0] .content;

var showLogic = new function() { var that = this; that.init = function() { var REQ = new XMLHttpRequest(); REQ.open("POST", "/api/"); REQ.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); REQ.send("action=purchases"); REQ.onreadystatechange = function() { var resp = this.response; if (!!resp) { var arr = JSON.parse(resp)[0].content; var html = '<thead><tr><td id="select-all-inputs"><span>Все</span></td><td><span>QR-code</span></td><td class="sorted-column"><span>ФИО</span></td><td><span>Контакты</span></td><td><span>ID</span></td><td><span>Дата покупки</span></td><td><span>Бонусов <b>F</b></span></td><td><span>Бонусные покупки</span></td></tr></thead><tbody>'; for (var i = 0; i < arr.length; i++) { var image = arr[i].qr, date = arr[i].purchase_date; var bonus_purchs_item = arr[i].bonus_purchs; var bonus_purchs = "", bonus_purchs_id = ""; for (var bp = 0; bp < bonus_purchs_item.length; bp++) { bonus_purchs += bonus_purchs_item[bp] + '<br>'; } var bonus_purchs_item_2 = arr[i].bonus_purchs_array; for (var bpa = 0; bpa < bonus_purchs_item_2.length; bpa++) { bonus_purchs_id += bonus_purchs_item_2[bpa].id + '=' + bonus_purchs_item_2[bpa].name + ';'; } if (image.length == 0) { image = "images/no.svg" }; html += '<tr><td><div class="checkbox-click-field"></div><input class="checkbox" id="f' + arr[i].id + '" type="checkbox" data-inner-array-of-id="' + bonus_purchs_id.slice(0, bonus_purchs_id.length - 1) + '"> <label for="f' + arr[i].id + '"></label></td><td><img src="' + image + '"></td><td><span class="table-user-name">' + arr[i].user.lname + '</span><br>' + arr[i].user.fname + ' ' + arr[i].user.ffname + '</td><td><b>' + arr[i].user.phone_num + '</b><br>' + arr[i].user.email + '</td><td>' + arr[i].extern_id + '</td><td>' + date.replace(" ", "<br>") + '</td><td><b>' + arr[i].awarded_bonuses + '</b> F</td><td>' + bonus_purchs + '</td></tr>'; }; }; html += '</tbody>'; document.getElementById('show-products').innerHTML = html; updateEventsLogic.init(); }; return false; }; return that; }; 

The essence of the script is that to show the list of products in another section of the site, there is exactly the same script, with a list of notifications and it does not produce any errors. As you can see in the code, I checked this.response for emptiness; but does not want to here

  • possibly missing a closing bracket, after closing curly brackets why semicolon? - Jean-Claude

1 answer 1

The fact is that onreadystatechane called not only upon completion of the request, but throughout the execution of the request. Those. if the answer does not fit into one tcp packet entirely, then the callback will be called with a partial answer, in which this.readyState==3 . You need before checking the answer as such - check that readyState==4 . 4 - the status of the completed request.

 var showLogic = new function() { var that = this; that.init = function() { var REQ = new XMLHttpRequest(); REQ.open("POST", "/api/"); REQ.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); REQ.send("action=purchases"); REQ.onreadystatechange = function() { var resp = this.response; if (this.readyState != 4) return; // добавленый кусок if (!!resp) { var arr = JSON.parse(resp)[0].content; var html = '<thead><tr><td id="select-all-inputs"><span>Все</span></td><td><span>QR-code</span></td><td class="sorted-column"><span>ФИО</span></td><td><span>Контакты</span></td><td><span>ID</span></td><td><span>Дата покупки</span></td><td><span>Бонусов <b>F</b></span></td><td><span>Бонусные покупки</span></td></tr></thead><tbody>'; for (var i = 0; i < arr.length; i++) { var image = arr[i].qr, date = arr[i].purchase_date; var bonus_purchs_item = arr[i].bonus_purchs; var bonus_purchs = "", bonus_purchs_id = ""; for (var bp = 0; bp < bonus_purchs_item.length; bp++) { bonus_purchs += bonus_purchs_item[bp] + '<br>'; } var bonus_purchs_item_2 = arr[i].bonus_purchs_array; for (var bpa = 0; bpa < bonus_purchs_item_2.length; bpa++) { bonus_purchs_id += bonus_purchs_item_2[bpa].id + '=' + bonus_purchs_item_2[bpa].name + ';'; } if (image.length == 0) { image = "images/no.svg" }; html += '<tr><td><div class="checkbox-click-field"></div><input class="checkbox" id="f' + arr[i].id + '" type="checkbox" data-inner-array-of-id="' + bonus_purchs_id.slice(0, bonus_purchs_id.length - 1) + '"> <label for="f' + arr[i].id + '"></label></td><td><img src="' + image + '"></td><td><span class="table-user-name">' + arr[i].user.lname + '</span><br>' + arr[i].user.fname + ' ' + arr[i].user.ffname + '</td><td><b>' + arr[i].user.phone_num + '</b><br>' + arr[i].user.email + '</td><td>' + arr[i].extern_id + '</td><td>' + date.replace(" ", "<br>") + '</td><td><b>' + arr[i].awarded_bonuses + '</b> F</td><td>' + bonus_purchs + '</td></tr>'; }; }; html += '</tbody>'; document.getElementById('show-products').innerHTML = html; updateEventsLogic.init(); }; return false; }; return that; };