I am building an HTML5 Cordova App. I am using JQuery and Pure JS to fetch data from the server and implement other dynamic functions. My problem is that at some point in my app, I am fetching some data via ajax and use jquery to dynamically create a table and populate it with the fetched data and then navigate or change the view to where I am appending the table.
When I run this in my browser it work just fine, but when I build the app and run it on my mobile device, it throws TypeError: String(...).padStart is not a function
. I know this because I am alerting the error in my catch
clause. What's strange is that I have not use the padStart()
function anywhere in my code.
See the below code
createTableDOM(response,function(res){
if(res=="Done"){
changeView('data_preview_view');
}
})
function createTableDOM(json, back) {
var time = new Date().toLocaleTimeString();
let table = $("<table/>");
let tbody = $("<tbody>/");
//CREATE ELEMENTS
let div = $("<div/>");
div.addClass("col s12");
div.css({ "padding": ".2em;", "background": "black", "color": "white" });
let h1 = $("<h1/>");
h1.css("width", "100%");
h1.html("TICKET # :" + json.ticket_number);
div.append(h1);
let row1 = $("<tr>/");
let td1a = $("<td>/");
td1a.html("Market Code: ");
let td1b = $("<td>/");
td1b.css("text-align", "right");
td1b.html(json.data.market);
row1.append(td1a, td1b);
let row2 = $("<tr>/");
let td2a = $("<td>/");
td2a.html("Name: ");
let td2b = $("<td>/");
td2b.css("text-align", "right");
td2b.html(json.data.business_name);
row2.append(td2a, td2b);
let row3 = $("<tr>/");
let td3a = $("<td>/");
td3a.html("Contact: ");
let td3b = $("<td>/");
td3b.css("text-align", "right");
td3b.html(json.data.phone_number);
row3.append(td3a, td3b);
let row4 = $("<tr>/");
let td4a = $("<td>/");
td4a.html("Time: ");
let td4b = $("<td>/");
td4b.css("text-align", "right");
td4b.html(time);
row4.append(td4a, td4b);
let row5 = $("<tr>/");
let td5a = $("<td>/");
td5a.html("Date: ");
let td5b = $("<td>/");
td5b.css("text-align", "right");
td5b.html(getCurrentDate());
row5.append(td5a, td5b);
let row6 = $("<tr>/");
let td6a = $("<td>/");
td6a.html("Revenue Type: ");
let td6b = $("<td>/");
td6b.css("text-align", "right");
td6b.html("Market Fee");
row6.append(td6a, td6b);
let row7 = $("<tr>/");
let td7a = $("<td>/");
td7a.html("Fee: ");
let td7b = $("<td>/");
td7b.css("text-align", "right");
td7b.html("K100");
row7.append(td7a, td7b);
tbody.append(row1, row2, row3, row4, row5, row6, row7);
table.append(tbody);
var parent = $("#table_div");
parent.empty();
parent.append(div,table);
back("Done");
}