How to insert new tr every third iteration in Jade - node.js

I'm new in node.js and Jade.
I searched for solutions without success (maybe I asked wrong questions in google, I don't know).
I want to create table rows in each loop in Jade. The thing is that after every 3rd td I want insert new tr. Normally it's quite simple but with Jade I simply can't achieve that.
My Jade file:
table
thead
tr
td Header
tbody
each item, i in items
if (i % 3 === 0)
tr
td
a(href="#{baseUrl}/admin.html?id=#{item.id}")
I know that something is wrong with my if statement. I tried many configurations without luck. I'm sure that it will be quite easy issue.
Thanks in advance for help!
EDIT
Based on #Laurent Perrin answer I modified a little my code. Now it creates tr, then 3 td and then new tr so it's a little closer...
New Jade
if (i % 3 === 0)
tr
td: a(href="#{baseUrl}/admin.html?id=#{item.id}") dsdsd #{i}
Generated HTML
<tr></tr>
<td>0</td>
<td>1</td>
<td>2</td>
<tr></tr>

EDIT: this code should do what you want, but it's not very elegant:
table
thead
tr: td Header
tbody
- for(var i = 0, nbRows = items.length/3; i < nbRows; i++) {
tr
if items[3*i]
td: a(href="#{baseUrl}/admin.html?id=#{items[3*i].id}")
if items[3*i + 1]
td: a(href="#{baseUrl}/admin.html?id=#{items[3*i + 1].id}")
if items[3*i + 2]
td: a(href="#{baseUrl}/admin.html?id=#{items[3*i + 2].id}")
- }
What you could do instead is tweak your model to make it more Jade-friendly, by grouping items by rows:
function getRows(items) {
return items.reduce(function (prev, item, i) {
if(i % 3 === 0)
prev.push([item]);
else
prev[prev.length - 1].push(item);
return prev;
}, []);
}
This will turn:
[{id:1},{id:2},{id:3},{id:4},{id:5}]
into:
[
[{id:1},{id:2},{id:3}],
[{id:4},{id:5}]
]
Then your jade code becomes much simpler:
table
thead
tr: td Header
tbody
each row in rows
tr
each item in row
td: a(href="#{baseUrl}/admin.html?id=#{item.id}")

An example of jade + bootstrap, each 4 elements(columns) one row, and the rows goes inside the row.
```
- var i = 0
- var itens_per_line = 4
each order in viewBag.orders
- if (i % itens_per_line === 0 || i === 0) {
.row
- }
.col-md-3.column
p #{order.number}
- i++
```

Here is what I did for a single array (e.g. ['1','2','3','4']) to convert it into two values per row, it could be adjusted for 3.
(mixins are templates in Jade/Pug)
mixin mInput
div.form-group.col-md-6
p=oval
- var valcounter = 0
- var row = [];
each val in JSON.parse(formvalues)
if(valcounter % 2 === 0)
- var col = [];
- col.push(val)
else
- col.push(val)
- row.push(col)
- valcounter++
each orow in row
div.row
each oval in orow
+mInput

Related

cheerio fetch tr:nth-child() length for iteration

All,
I am using cheerio package for web scraping,
cheerio tr selector as below. i want to find length of x to iterate
body > table > tbody > tr:nth-child(x) > th:nth-child(2)
Below is my score card html, i want to calculate the total marks of subjects.
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"/><title>Student Score Card</title><h3>Score card</h3>
<table>
<tr><th>Subject</th><th>Marks</th></tr>
<tr><th>English</th><th>78</th></tr>
<tr><th>Maths</th><th>98</th></tr>
<tr><th>Science</th><th>83</th></tr>
<tr><th>Lab</th><th>80</th></tr>
<tr><th>Physical</th><th>75</th></tr>
</table></html>
here i know the row count as 6, so hard coded the value. however it may change in future. so not able to find the max value via code, looking for help here.
Sample logic
const $ = cheerio.load(scorecard.html);
let total = 0;
for(i=0;i<6;i++){
total += parseInt($("body > table > tbody > tr:nth-child("+i+") > th:nth-child(2)").text().valueOf());
}
console.log(total);
If I understand correctly what you are trying to do, then this should help.
const selectors = Array.from($("body > table > tbody > tr"));
let total = 0;
for (let i = 0; i < selectors.length; i++) {
total += parseInt($(selectors[i]).find("th:nth-child(2)").text());
}
console.log(total);

Kendo UI: Manipulating grid columns during export to excel and pdf

I have a Kendo grid that uses Export-to-excel and Export-to-pdf.
One particular column consists of data with padded zeros (so that column sorting works). Then, this column uses a template to display the data without the padded zeros (a business requirement). This is perfect for the grid.
Now, the export functions do not export the template, they export the underlying data (this is documented in the Known Limitations). So my exports show the data with padded-zeros. But... I need to show the data without padded zeros. So I have been looking for a workaround.
Workaround attempt A)
I created two columns padded and non-padded. The idea was this:
Column i/ Data = padded; Grid view = non-padded; do not export.
Column ii/ Data = non-padded; Grid view = hidden; export.
However, this doesn't work for two reasons.
Column i/ columns: exportable: { pdf: false, excel: false } doesn't actually seem to work(!!!)
Column ii/ This isn't legal anyway. If you hide the data in the grid you can't export it anyway.
Workaround attempt B)
In the excelExport() function I did this:
excelExport: function (e) {
for (var j = 0; j < e.data.length; j++) {
e.data[j].padded_column = e.data[j].non-padded_column;
}
},
In the console this appears to work fine, that is I replace the value of the padded column with the data of the non-padded column. However, it makes no difference to what appears on the spreadsheet. My guess is that this is because the spreadsheet has already been generated before excelExport() modifies the data.
So, I need a new approach. Can anybody help?
ADDITIONAL INFO
For further reference, here is the code for the column:
columns: [{
field: 'sys_id_sorted',
title: 'File ref',
hidden: false,
template: function (dataItem) {
var ctyClass = '';
switch (dataItem.cty_id) {
case '1':
ctyClass = 'CHAP';
break;
case '2':
ctyClass = 'EU-PILOT';
break;
case '3':
ctyClass = 'NIF';
break;
case '4':
ctyClass = 'OTHER';
break;
default:
ctyClass = 'default';
break;
}
return '<div class="label label-' + ctyClass + ' origin">' + dataItem.sys_id + '</div>';
}
},
'sys_id_sorted' is the field that has padded zeros.
'dataItem.sys_id' is the field with no padded zeros.
In the excelExport event you have access to the workbook, thus, you could modify it as follows:
var sheet = e.workbook.sheets[0];
for (var i = 1; i < sheet.rows.length; i++) {
var row = sheet.rows[i];
row.cells[0].value = row.cells[0].value.replace(/^0+/, '')
}
You can test the same in the following sample:
https://dojo.telerik.com/ADIfarOp
Kudos to Georgi Yankov for pointing me in the right direction. The solution is to manipulate the values found in e.workbook, not e.data. Here is my (simplified for brevity) solution. The four vars inside the loop are simply manipulating the string to create my non-padded version. 'row.cells[0].value' is the original zero-padded string. The data-replacement happens on the last line:
excelExport: function (e) {
var sheet = e.workbook.sheets[0];
for (var k = 1; k < sheet.rows.length; k++) {
var row = sheet.rows[k];
var sys_id_sorted = row.cells[0].value;
var caseNum = sys_id_sorted.substring(9);
var caseNumTrimmed = caseNum.replace(/^0+/, '');
row.cells[0].value = sys_id_sorted.substring(0,9) + caseNumTrimmed;
}
},

Delete rows after a date has passed automatically for Google Spreadsheets [duplicate]

I'd like to be able to delete an entire row in a Google Spreadsheets if the value entered for say column "C" in that row is 0 or blank. Is there a simple script I could write to accomplish this?
Thanks!
I can suggest a simple solution without using a script !!
Lets say you want to delete rows with empty text in column C.
Sort the data (Data Menu -> Sort sheet by column C, A->Z) in the sheet w.r.t column C, so all your empty text rows will be available together.
Just select those rows all together and right-click -> delete rows.
Then you can re-sort your data according to the column you need.
Done.
function onEdit(e) {
//Logger.log(JSON.stringify(e));
//{"source":{},"range":{"rowStart":1,"rowEnd":1,"columnEnd":1,"columnStart":1},"value":"1","user":{"email":"","nickname":""},"authMode":{}}
try {
var ss = e.source; // Just pull the spreadsheet object from the one already being passed to onEdit
var s = ss.getActiveSheet();
// Conditions are by sheet and a single cell in a certain column
if (s.getName() == 'Sheet1' && // change to your own
e.range.columnStart == 3 && e.range.columnEnd == 3 && // only look at edits happening in col C which is 3
e.range.rowStart == e.range.rowEnd ) { // only look at single row edits which will equal a single cell
checkCellValue(e);
}
} catch (error) { Logger.log(error); }
};
function checkCellValue(e) {
if ( !e.value || e.value == 0) { // Delete if value is zero or empty
e.source.getActiveSheet().deleteRow(e.range.rowStart);
}
}
This only looks at the value from a single cell edit now and not the values in the whole sheet.
I wrote this script to do the same thing for one of my Google spreadsheets. I wanted to be able to run the script after all the data was in the spreadsheet so I have the script adding a menu option to run the script.
/**
* Deletes rows in the active spreadsheet that contain 0 or
* a blank valuein column "C".
* For more information on using the Spreadsheet API, see
* https://developers.google.com/apps-script/service_spreadsheet
*/
function readRows() {
var sheet = SpreadsheetApp.getActiveSheet();
var rows = sheet.getDataRange();
var numRows = rows.getNumRows();
var values = rows.getValues();
var rowsDeleted = 0;
for (var i = 0; i <= numRows - 1; i++) {
var row = values[i];
if (row[2] == 0 || row[2] == '') {
sheet.deleteRow((parseInt(i)+1) - rowsDeleted);
rowsDeleted++;
}
}
};
/**
* Adds a custom menu to the active spreadsheet, containing a single menu item
* for invoking the readRows() function specified above.
* The onOpen() function, when defined, is automatically invoked whenever the
* spreadsheet is opened.
* For more information on using the Spreadsheet API, see
* https://developers.google.com/apps-script/service_spreadsheet
*/
function onOpen() {
var sheet = SpreadsheetApp.getActiveSpreadsheet();
var entries = [{
name : "Remove rows where column C is 0 or blank",
functionName : "readRows"
}];
sheet.addMenu("Script Center Menu", entries);
};
Test spreadsheet before:
Running script from menu:
After running script:
I was having a few problems with scripts so my workaround was to use the "Filter" tool.
Select all spreadsheet data
Click filter tool icon (looks like wine glass)
Click the newly available filter icon in the first cell of the column you wish to search.
Select "Filter By Condition" > Set the conditions (I was using "Text Contains" > "word")
This will leave the rows that contain the word your searching for and they can be deleted by bulk selecting them while holding the shift key > right click > delete rows.
This is what I managed to make work. You can see that I looped backwards through the sheet so that as a row was deleted the next row wouldn't be skipped. I hope this helps somebody.
function UpdateLog() {
var returnSheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('RetLog');
var rowCount = returnSheet.getLastRow();
for (i = rowCount; i > 0; i--) {
var rrCell = 'G' + i;
var cell = returnSheet.getRange(rrCell).getValue();
if (cell > 0 ){
logSheet.
returnSheet.deleteRow(i);
}
}
}
quite simple request. Try this :
function try_It(){
deleteRow(2); //// choose col = 2 for column C
}
function deleteRow(col){ // col is the index of the column to check for 0 or empty
var sh = SpreadsheetApp.getActiveSheet();
var data = sh.getDataRange().getValues();
var targetData = new Array();
for(n=0;n<data.length;++n){
if(data[n][col]!='' && data[n][col]!=0){ targetData.push(data[n])};
}
Logger.log(targetData);
sh.getDataRange().clear();
sh.getRange(1,1,targetData.length,targetData[0].length).setValues(targetData);
}
EDIT : re-reading the question I'm not sure if the question is asking for a 'live' on Edit function or a function (like this above) to apply after data has been entered... It's not very clear to me... so feel free to be more accurate if necessary ;)
There is a simpler way:
Use filtering to only show the rows which you want to delete. For example, my column based on which I want to delete rows had categories on them, A, B, C. Through the filtering interface I selected only A and B, which I wanted to delete.
Select all rows and delete them. Doing this, in my example, effectively selected all A and B rows and deleted them; now my spreadsheet does not show any rows.
Turn off the filter. This unhides my C rows. Done!
There is a short way to solve that instead of a script.
Select entire data > Go to menu > click Data tab > select create filter > click on filter next to column header > pop-up will appear then check values you want to delete > click okay and copy the filtered data to a different sheet > FINISH
reading your question carefully, I came up with this solution:
function onOpen() {
// get active spreadsheet
var ss = SpreadsheetApp.getActiveSpreadsheet();
// create menu
var menu = [{name: "Evaluate Column C", functionName: "deleteRow"}];
// add to menu
ss.addMenu("Check", menu);
}
function deleteRow() {
// get active spreadsheet
var ss = SpreadsheetApp.getActiveSpreadsheet();
// get active/selected row
var activeRow = ss.getActiveRange().getRowIndex();
// get content column C
var columnC = ss.getRange("C"+activeRow).getValue();
// evaluate whether content is blank or 0 (null)
if (columnC == '' || columnC == 0) {
ss.deleteRow(parseInt(activeRow));
}
}
This script will create a menu upon file load and will enable you to delete a row, based on those criteria set in column C, or not.
This simple code did the job for me!
function myFunction() {
var ss = SpreadsheetApp.getActiveSpreadsheet(); // get active spreadsheet
var activeRow = ss.getActiveRange().getRowIndex(); // get active/selected row
var start=1;
var end=650;
var match='';
var match2=0; //Edit this according to your choice.
for (var i = start; i <= end; i++) {
var columnC = ss.getRange("C"+i).getValue();
if (columnC ==match || columnC ==match2){ ss.deleteRow(i); }
}
}
The below code was able to delete rows containing a date more than 50 days before today in a particular column G , move these row values to back up sheet and delete the rows from source sheet.
The code is better as it deletes the rows at one go rather than deleting one by one. Runs much faster.
It does not copy back values like some solutions suggested (by pushing into an array and copying back to sheet). If I follow that logic, I am losing formulas contained in these cells.
I run the function everyday in the night (scheduled) when no one is using the sheet.
function delete_old(){
//delete > 50 day old records and copy to backup
//run daily from owner login
var ss = SpreadsheetApp.getActiveSpreadsheet();
var bill = ss.getSheetByName("Allotted");
var backss = SpreadsheetApp.openById("..."); //backup spreadsheet
var bill2 = backss.getSheetByName("Allotted");
var today=new Date();
//process allotted sheet (bills)
bill.getRange(1, 1, bill.getMaxRows(), bill.getMaxColumns()).activate();
ss.getActiveRange().offset(1, 0, ss.getActiveRange().getNumRows() - 1).sort({column: 7, ascending: true});
var data = bill.getDataRange().getValues();
var delData = new Array();
for(n=data.length-1; n>1; n--){
if(data[n][6] !=="" && data[n][6] < today.getTime()-(50*24*3600*1000) ){ //change the condition as per your situation
delData.push(data[n]);
}//if
}//for
//get first and last row no to be deleted
for(n=1;n<data.length; n++){
if(data[n][6] !=="" && data[n][6] < today.getTime()-(50*24*3600*1000) ){
var strow=n+1 ; //first row
break
}//if
}//for
for(n=data.length-1; n>1; n--){
if(data[n][6] !=="" && data[n][6] < today.getTime()-(50*24*3600*1000) ){
var ltrow=n+1 ; //last row
break
}//if
}//for
var bill2lr=bill2.getLastRow();
bill2.getRange((bill2lr+1),1,delData.length,delData[0].length).setValues(delData);
bill.deleteRows(strow, 1+ltrow-strow);
bill.getRange(1, 1, bill.getMaxRows(), bill.getMaxColumns()).activate();
ss.getActiveRange().offset(1, 0, ss.getActiveRange().getNumRows() - 1).sort({column: 6, ascending: true}); //get back ordinal sorting order as per column F
}//function

Javascript unwanted cell removal from a table

I want to copy paste from excel to webpage. This issue is resolved using Copy/Paste from Excel to a web page
However now I want these fields to be editable and submit it in a form. So I changed the code to :
function generateTable() {
var data = $('textarea[name=excel_data]').val();
console.log(data);
var rows = data.split("\n");
var table = $('<table />');
var counterRow = 0;
var counterCol = 0;
for(var y in rows) {
var cells = rows[y].split("\t");
var row = $('<tr />');
for(var x in cells) {
row.append('<td border-collapse:collapse>' + '<textarea style="overflow:auto" name=' + counterRow + counterCol + '>' +cells[x]+'</textarea>'+'</td>');
counterCol++;
}
counterRow++;
table.append(row);
}
// Insert into DOM
$('#excel_table').html(table);
}
The problem is : there is an additional row containing 1 cell displayed towards the end of the table.
___________
|___|___|___|
|___|___|___|
|___|
I had to use this if clause inside the for :
if(rows[y]){

Conditional Formatting for items created in the last 5 minutes in SharePoint 2010

All,
I've been looking all day and have tried numerous solutions, but just can't get it to work. Our team projects a list that is constantly updated and we want to highlight only newly created items for 5 minutes. After 5 minutes, the row would return to normal. (FYI- the list is projected on a display and updated using AJAX asynchronous update every 15 seconds)
Basically, I want to set conditional formatting on list items created in the last 5 minutes. If the item was created in the last 5 minutes, the row will be highlighted. After the 5 minutes are up, the row would return to normal.
I tried SharePoint Designer conditional formatting by creating a calculated column in Date/Time format called "Created + 5" and tried to set an expression where the formatting is applied (row is highlighted) when "Created + 5" is greater than or equal to current date. So after 5 minutes, the row will no longer be highlighted (because the current date/time will exceed the "Created + 5" value)
Here is the expression from the SPD Advanced Condition Builder:
ddwrt:DateTimeTick(ddwrt:GenDisplayName(string($thisNode/#Created_x0020__x002b__x0020_5_x))) >=
ddwrt:DateTimeTick(ddwrt:GenDisplayName(string($Today)))
I think the problem is that the [Current Date] option ($Today in the expression builder) only accounts for date and not time. It looks like it just ends up highlighting everything that was created today, which is not very useful.
Any thoughts or help!? I have never messed with the advanced conditions because usually the basic stuff works fine for me! If anyone has any other ideas too like JavaScript or anything else that would work, I am open to that too as long as it will continuously update!
Thanks all!!!!
[Today] actually doesn't work properly in 2010, there are some workarounds though, e.g. https://abstractspaces.wordpress.com/2008/05/19/use-today-and-me-in-calculated-column/.
You can also use the approach with calculated column: https://blog.splibrarian.com/2012/06/06/using-calculated-columns-to-add-color-coding-to-your-sharepoint-lists/
Since you want this to update automatically without requiring someone to manually refresh the page, JavaScript is your best bet. You can have a function run repeatedly on a specified interval, checking the current date against the values in a date column.
Something like the following code would work, though you may need to tweak the CSS selectors specified in the calls to document.querySelector and querySelectorAll to match your particular HTML.
<script>
formatCell();
function formatCell(){
var frequencyToCheck = 2 /* num seconds between updates */
var minutes = 5; /* num minutes back to highlight */
var targetColumn = "Display name of the column you want to check";
var formatting = "background-color:darkred;color:red;font-weight:bold;";
var comparisonDate = new Date();
comparisonDate.setHours(comparisonDate.getHours() - minutes);
var tables = document.querySelectorAll("table.ms-listviewtable"); /* should get all list view web parts on the page */
var t_i = 0;
while(t_i < tables.length){
var headings = tables[t_i].rows[0].cells;
var columnIndex = null;
var h_i = 0;
while(h_i < headings.length){
var heading = headings[h_i].querySelector("div:first-child");
if(heading != null){
var displayName = heading.DisplayName ? heading.DisplayName : (heading.innerText ? heading.innerText : heading.textContent);
displayName = displayName.replace(/^\s+|\s+$/g,''); /* removes leading and trailing whitespace */
if(displayName === targetColumn){
columnIndex = h_i;
break;
}
}
h_i += 1;
}
if(columnIndex != null){ /* we found a matching heading */
var rows = tables[t_i].rows;
for(var i = (rows.length > 0 ? 1 : 0); i < rows.length; i++){
var cells = rows[i].children;
if(cells.length <= columnIndex){continue;}
var valueToEval = cells[columnIndex].innerText ? cells[columnIndex].innerText : cells[columnIndex].textContent;
if(typeof valueToEval == "undefined"){valueToEval = "";}
valueToEval = new Date(valueToEval);
if(valueToEval > comparisonDate){
cells[columnIndex].setAttribute("style",formatting);
}else{
cells[columnIndex].setAttribute("style","");
}
}
}
t_i +=1;
}
setTimeout(formatCell,frequencyToCheck * 1000);
}
</script>
One potential pitfall is that while this approach will "age" records appropriately based on their displayed values (causing them to stop being highlighted as they grow stale), it won't automatically pick up new changes to the list; you'd need to refresh the page (or at least refresh the view in the web part) whenever you want to see updated information.

Resources