I need help
I have a problem with making reports invoices with pre-printed paper. when an item of the invoice exceeds the capacity, automatically the rest of the items will be printed onto a second page.
I use a javascript programming language. No one can give a solution?
for (var x = 1; x <= lineCount; x++){
var strItem = '';
var strUnit ='';
var strJumlah ='';
var strHargaSatuan ='';
var strHargaTotal ='';
if(recIV.getLineItemValue('item','item', x)){
strItem = recIV.getLineItemText('item','item', x);
}
if(recIV.getLineItemValue('item','units', x)){
strUnit = recIV.getLineItemText('item','units', x);
}
if(recIV.getLineItemValue('item','quantity', x)){
strJumlah = recIV.getLineItemValue('item','quantity', x);
}
if(recIV.getLineItemValue('item','rate', x)){
strHargaSatuan = recIV.getLineItemValue('item','rate', x);
}
if(recIV.getLineItemValue('item','amount', x)){
strHargaTotal = recIV.getLineItemValue('item','amount', x);
}
strName += ' <tr style=\"font-size:13px\" line-height=\"11px\">';
strName += ' <td width=\"10%\" align=\"center\">'+ x +'</td>';
strName += ' <td width=\"35%\">'+strItem+'</td>';
strName += ' <td width=\"15%\">'+strUnit+'</td>';
strName += ' <td width=\"10%\">'+strJumlah+'</td>';
strName += ' <td width=\"20%\">Rp '+addCommas(strHargaSatuan)+'</td>';
strName += ' <td width=\"20%\">Rp '+addCommas(strHargaTotal)+'</td>';
strName += ' </tr>';
}
I have written a web app that does this for a friend's business. What I do is create the element, append it to the actual DOM, then measure the height in pixels using parseInt(getComputedStyle(item_list[i]).height)
As soon as the height exceeds the available space I remove the last item and start appending to the 2nd page.
Related
How can I populate my table with an array of local storage data?
function savePlayer() {
let Player = {player,score};
localStorage.setItem("Player", JSON.stringify(Player));
let getPlayerScore = Player;
let text = document.getElementById("topScores");
for(let i = 0; i <Player.length; i++){
text += "<tr>";
text += "<td>" + getPlayerScore[i].player + "</td>";
text += "<td>" + getPlayerScore[i].score + "</td></tr>";
}
Here's the HTML:
<body>
<table id = "topScores">
<tr>
<th>Username</th>
<th>Score</th>
</tr>
</table>
</body>
What am I doing wrong?
The Player.toString() isn't what you think it is.
var player = "Mario";
var score = 1000;
var Player = {
player,
score
};
// Print Player
console.log(JSON.stringify(Player));
console.log(Player.toString());
You can't just add text to an element; you need to set it though
innerHTML. Sadly, however, you can't set it for each row, because the DOM will try to end the tr tag, so you need to set everything at the same time through a string.
I couldn't get localStorage to work in the snippet so I commented out the code without testing it.
Another solution would be to append the elements, and honestly, that's what I would prefer, but I didn't want to steer to far away from your original solution, and I didn't want fix the "feature" where the DOM is autocompleting tr tags.
function savePlayer() {
// This wasn't an array to begin with, so I fixed that.
let Player = [{"player": "player","score": 10}];
// It's usually preferred to refer to a public constant when accessing localStorage.
let localStorageKey = "player";
/* localStorage.setItem(localStorageKey, JSON.stringify(Player));
let getPlayerScore = JSON.parse(localStorage.getItem(localStorageKey));*/
let getPlayerScore = Player;
let text = document.getElementById("topScores");
var playerRow = "";
for(let i = 0; i < getPlayerScore.length; i++){
playerRow = "<tr>";
playerRow += "<td>" + getPlayerScore[i].player + "</td>";
playerRow += "<td>" + getPlayerScore[i].score + "</td></tr>";
}
text.innerHTML += playerRow;
}
<body onload="savePlayer()">
<table id="topScores">
<tr>
<th>Username</th>
<th>Score</th>
</tr>
</table>
</body>
When I retrieve cell value from google sheet with google app script then it returns 'undefined' when the value in that cell is 'zero'. I need it to be remain zero when I send the values to a email.Image Result of the cell value where value is zero in google sheet
function sendEmails() {
var app = SpreadsheetApp;
var targetSheet = app.getActiveSpreadsheet().getSheetByName("Template");
var i,j; var k=4;
for(i=2; i<=2; i++){
var infoData = [];
for(j=2; j<=5; j++){
var cellValues = targetSheet.getRange(i, j).getValue();
infoData.push(cellValues);
}
var emailSheet = app.getActiveSpreadsheet().getSheetByName("Emails");
var currentEmail = app.getActiveSheet().activate().getRange(i, 1).getValue();
var subject = app.getActiveSheet().activate().getRange(i, 2).getValue();
var block = app.getActiveSheet().activate().getRange(i, 3).getValue();
//var emailQuotaRemaining = MailApp.getRemainingDailyQuota();
//Logger.log("Remaining email quota: " + emailQuotaRemaining);
var body = "<h3>Dear Sir/Ma'am,</h3>" +
"<h3>Daily MGNREGA progress Report on different parameters.</h3>" +
"<table border = '1'>" +
"<tr><td>BLOCK: </td><td>" + block + "</td><tr>" +
"</table>" +
"<table border = '1'>" +
"<tr font-style = 'bold'><td>#S.NO</td> <td align = 'center'> PARAMETERS </td><td align = 'center'> VALUES </td></tr>" +
"<tr><td align = 'center'>1.</td> <td align = 'left'> Percentage of NRM Expenditure for the financial year 2019-20 (So far) </td><td align = 'right'>" + infoData[0] + "</td></tr>" +
"<tr><td align = 'center'>2.</td> <td align = 'left'> Percentage of Timely MGNREGA wage payment (T+8 days) FY 2019-20 </td><td align = 'right'>" + infoData[1] + "</td></tr>" +
"<tr><td align = 'center'>3.</td> <td align = 'left'> Work completion rate FY 2017-18 and Earlier in percentage</td><td align = 'right'>" + infoData[2] + "</td></tr>" +
"<tr><td align = 'center'>4.</td> <td align = 'left'> No. of Rejected transactions pending Reconcilation of FY 2018-19 </td><td align = 'right'>" + infoData[3] + "</td></tr>" +
"<tr><td align = 'center'>5.</td> <td align = 'left'> Pending Geotagging Stage- 3 of Phase-II (Completed Works) </td><td align = 'right'>" + infoData[4] + "</td></tr>" +
"<tr><td align = 'center'>6.</td> <td align = 'left'> FTOs Pending for First signatory FY 2019-20 </td><td align = 'right'>" + infoData[5] + "</td></tr>" +
"<tr><td align = 'center'>7.</td> <td align = 'left'> FTOs Pending for Second signatory FY 2019-20 </td><td align = 'right'>" + infoData[6] + "</td></tr>" +
"<tr><td align = 'center'>8.</td> <td align = 'left'> No. of Rejected transactions pending Reconcilation FY 2019-20 </td><td align = 'right'>" + infoData[7] + "</td></tr>" +
"</td></tr>" +
"</table>" +
"<h4>NOTE: This Alert message is valid for Today only. Thanks</h4>" +
"<h3>Regards,</h3>" +
"<h3>DRDA Barpeta</h3>";
var options = {
htmlBody : body
}
MailApp.sendEmail(currentEmail, subject, "", options);
}
}
You can set a default value to cellValue by adding a || 0 so that the cellValue gets set as 0 if targetSheet.getRange(i, j).getValue() returns undefined
Try this
var cellValues = targetSheet.getRange(i, j).getValue() || 0;
It'd be really helpful if we could tell what the raw data of infoData was (I'm not all too familiar with Google App Scripts), but I'll do my best. Now, this isn't code golf, but we can detect and replace all undefined values with 0 with a for loop.
var i;
for (i = 0; i < infoData.length; i++) {
if (infoData[i] == undefined) {
infoData[i] = 0;
}
}
Hope this helps!
I'm trying to output an array filled with Firestore objects onto a table, but just displays the last object above the table
<table class="darkTable">
<thead>
<tr>
<th>List of Available Shows</th>
</tr>
</thead>
<tbody>
<tr>
<div id="showList"></div>
</tr>
</tbody>
</table>
<script>
firebase.firestore().collection('TV Shows').get().then(snapshot => {
var i = 0;
var array = [];
snapshot.forEach(doc => {
array[i] = doc.data().show.name;
//console.log(doc.data().show.name);
//showList.innerHTML = array[i] + "<br />";
showList.innerHTML = '<td>' + array[i] + '</td>';
i++;
});
});
</script>
Is it the way I'm going about the td code lines?
assuming this markup:
<div id="showList"></div>
then it works about like this:
firebase.firestore().collection('TV Shows').get().then(snapshot => {
var showList = document.getElementById('showList');
var html = '<table class="darkTable"><thead><tr>';
html += '<th>List of Available Shows</th>';
/* add further columns into here, alike the one above. */
html += '</tr></thead><tbody>';
snapshot.forEach(doc => {
html += '<tr>';
html += '<td>' + doc.data().show.name + '</td>';
/* add further columns into here, alike the one above. */
html += '</tr>';
});
html += '</tbody></table>';
showList.append(html);
});
You're resetting the entire showList element with every iteration of the loop:
showList.innerHTML = '<td>' + array[i] + '</td>';
I suspect you mean to append to it each time instead or resetting it entirely each time. Maybe try building a string with each iteration, then set the whole thing after the loop is over.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I am facing an issue with JavaScript.I see that it works fine in chrome but not in IE9.This would not display what chrome is displaying on the web page as expected.
I am new to JavaScripting can I get help in fixing this issue.
<script type="text/javascript">
var tds = document.getElementById('course_table')
.getElementsByTagName('td');
var sum = 0;
for (var i = 0; i < tds.length; i++) {
if (tds[i].className == 'count-me') {
sum += isNaN(tds[i].innerHTML) ? 0
: parseInt(tds[i].innerHTML);
}
}
var lastrecord = tds[tds.length - 2].innerHTML;
var table = document.getElementById('course_table')
.getElementsByTagName('tr');
var max = table.length - 2;
document.getElementById('course_table').innerHTML += '<tr bgcolor=#FFCCFF><td></td><td>Total Courses</td><td>' + max + '</td><td>Total Credits Remaining</td><td>'+ sum + '</td><td> Expected Graduation Date</td><td></td><td>' + lastrecord + '</td><td></td></tr> ';
</script>
Thanks
Niveditha
The problem is most likely in the last line:
document.getElementById('course_table').innerHTML += '<tr bgcolor=#FFCCFF><td></td><td>fsffd</td><td>' + max + '</td><td>abcdRemaining</td><td>'+ sum + '</td><td> abc</td><td></td><td>' + lastrecord + '</td><td></td></tr> ';
IE doesn't handle trs being added by strings; besides it is non-standard. Replace that line with this, it programmatically builds up the row and is faster. I added the corresponding <td> as comments.
var table = document.getElementById('course_table');
var row = table.insertRow(-1);
row.style.backgroundColor = '#FFCCFF'; // `bgcolor` attribute is deprecated
row.insertCell(-1); // <td></td>
row.insertCell(-1).textContent = "fsffd"; // <td>fsffd</td>
row.insertCell(-1).textContent = max; // <td>' + max + '</td>
row.insertCell(-1).textContent = "abcdRemaining"; // <td>abcdRemaining</td>
row.insertCell(-1).textContent = sum; // <td>' + sum + '</td>
row.insertCell(-1).textContent = "abc"; // <td> abc</td>
row.insertCell(-1); // <td></td>
row.insertCell(-1).textContent = lastRecord; // <td>' + lastRecord + '</td>
row.insertCell(-1); // <td></td>
The important methods here are insertRow and insertCell, they are guaranteed to work. textContent is faster and safer than innerHTML. Please use CSS instead of the deprecated bgcolor attribute
Internet Explorer doesn't like adding <tr> elements to the <table> in that manner. What you can do is append a new <tbody> element to the table:
// ... the first part of your function ...
var lastrecord = tds[tds.length - 2].innerHTML;
var table = document.getElementById('course_table');
var newbody = document.createElement('tbody');
newbody.innerHTML = '<tr bgcolor=#FFCCFF><td></td><td>Total Courses</td><td>' + max + '</td><td>Total Credits Remaining</td><td>'+ sum + '</td><td> Expected Graduation Date</td><td></td><td>' + lastrecord + '</td><td></td></tr> ';
table.appendChild(newbody);
I have an array of elements I would like to put into an HTML table:
var tags_arr = [1,2,3,4,5,6,7,8,9,10,12,13,14,15,16,17,18,19];
I can make an HTML table by simply placing beginning <tr> tags every 4th iteration:
var checks = "<table border=1>";
for (var c = 0; c < tags_arr.length; c++){
if (c%4 == 0){
checks += "<tr>";
}
checks += "<td>" + tags_arr[c] + "</td>";
}
checks += "</table>";
$("body").append(checks);
JSBIN
However this solution relies on the browser to inject the closing <\tr> tag when it "sees" the new opening tag. The browser also seems not to care that the last row has fewer <td> cells than the previous rows do.
It works, but is there a way to make expand this so as not to completely rely on the browser. I've tried using a regex to inject them into the string, but it seems like there should be a way to do so in the loop. Is it feasible? Or since it only has to work in modern browsers, can I just rely on Chrome and Firefox to do the cleanup for me?
EDIT:
hacky regex way:
checks = checks.replace(/(<tr>)/g, "</tr><tr>").replace(/<\/tr>/, "");
checks += "</tr></table>";
The HTML5 spec explicitly tells us that it's not necessary to close <tr> and <td> tags in the obvious scenarios:
No need to close a <td> before the next <td> or <tr> or table block section (<tbody>, <tfoot>), or the </table> closing tag.
No need to close a <tr> before the next <tr>, block section, or table close.
I seriously doubt you'll run into modern browsers that won't do the right thing here. I bet even IE6 will do it properly.
You can simply append the TR closing tag before appending the starting TR tag:
for (var c = 0; c < tags_arr.length; c++){
if (c%4 == 0){
if (c !== 0) checks +="</tr>";
checks += "<tr>";
}
checks += "<td>" + tags_arr[c] + "</td>";
}
checks += "</tr></table>";
PS: Take care of the edge cases.
EDIT:
A more elgant solution is to distribute the items in arrays before hand:
var distributed = [];
var tags_arr = [1,2,3,4,5,6,7,8,9,10,12,13,14,15,16,17,18,19];
while(tags_arr.length > 0) {
distributed.push(tags_arr.splice(0,4));
}
And then use some smart loops to create the html:
var html = distributed.reduce(function(html, item){
var td = item.reduce(function(html, item){
return html + '<td>' + item + '</td>';
}, '');
return html + '<tr>' + td + '</tr>';
}, '');
html = '<table border=1>' + html + '</table>';
for (var c = 0; c < tags_arr.length; c++){
if (c%4 == 0){
if (c > 0) {
checks += "</tr>";
}
checks += "<tr>";
}
checks += "<td>" + tags_arr[c] + "</td>";
}
if (c > 0) { // Don't add a closing tag if there were no rows at all
checks += "</tr>";
}
Just close the tr tag before opening one. If c == 0 no tag have been opened yet.
Don't forget to close the last tag after the for loop
var checks = "<table border=1>";
for (var c = 0; c < tags_arr.length; c++){
if (c%4 == 0){
if (c > 0)
checks += "</tr>"
checks += "<tr>";
}
checks += "<td>" + tags_arr[c] + "</td>";
}
if (tags_arr.length > 0)
checks += "</tr>"
var cell = 0, len = tags_arr.length;
for(var row = 0; cell < len; row++) {
checks += '<tr>';
for(var col = 0; col < 4 && cell < len; col++, cell++)
checks += '<td>' + tags_arr[cell] + '</td>';
checks += '</tr>';
}
The correct solution - no divisions, no exceptional cases, no extra memory.