Im writing a small google script for an excel sheet which appends a row on a POST request: depending on the POST parameters I either append the row to the end, or I insert it in between rows.
One of the columns of the is actually a boolean that Im trying to represent as a checkbox.
The problem is when I try to append a row
sheet.appendRow([e.parameter.parameter1, e.parameter.parameter2, "FALSE"]);
It simply writes false in that column.
On the other hand when I insert a row in between other rows:
sheet.insertRows(position);
sheet.getRange("A" + (position)).setValue(e.parameter.parameter1);
sheet.getRange("B" + (position)).setValue(e.parameter.parameter2);
sheet.getRange("C" + (position)).setValue("FALSE");
The checkbox column (takes the format from the surrounding rows?) and becomes a checkbox.
Is there a simple solution to append a row with a column as a checkbox?
Thank you.
You need to create a checkbox first with data validation
Sample:
var checkbox = SpreadsheetApp.newDataValidation().requireCheckbox().build();
sheet.getRange("C" + (position)).setDataValidation(checkbox).setValue("FALSE");
Related
I'm using the Tabulator javascript table:
http://tabulator.info/docs/4.3/print
Is there a way to just print selected rows:
var table = new Tabulator("#example-table", {
printAsHtml:true, //enable html table printing
printVisibleRows:false, // print all rows in the table
});
What i am looking for is an option like "printSelectedRows: true) or some sort of work-around i can use to accomplish this.
There is no such option. One work around I can think of is a filter that results in only the rows you want being visible and not using printVisibleRows:false. Then only those rows would print. This of course depends on the row selection having some common element. For ad-hoc selection work around's I can think of are:
1) Moveable rows:
http://tabulator.info/docs/4.3/move#rows
Move the rows you want to the visible part of the table.
2) Move between tables:
Move rows to another table for printing.
http://tabulator.info/docs/4.3/move#rows-table
I have two tables that are placed side by side and i would to append selected row on the first table to the second tab
i managed to get the data from a selected row and convert it to an array. I tried using the v-bind tag to bind the data values in the second table and its not working
I expect to click a row in a table and that row is added to another table that is just placed on the side of the other table
What I understood from you question is that you are looking for a jquery code that makes the rows from the two tables to move from one table to the other whenever the user clicks on a row in any of the tables.
for example if you click on a row in first table, it moves to the second table and if you click on a row in second table, it moves to the first table.
if it is so, then the jquery code could be:
// identify the two tables with IDs for easier access
var tbl1=$('#table_1_id'), tbl2=$('#table_2_id');
// use tbody selector to make sure that you don't bind this event to table heading rows
$('#table_1_id,#table_2_id').find('tbody tr').on('click', moveRow);
function moveRow() {
// find on which table this row is
var row = $(this);
var table_current = row.closest('table');
// If current table ID equals to first table ID then it means we are in first table
if (table_current.prop('id')==tbl1.prop('id')) {
// Then we move the row to second table
tbl2.find('tbody').append(row);
} else {
// The row was in second table so we move it to first table
tbl1.find('tbody').append(row);
}
return;
}
I have a table generated by open data tables it generates perfectly. I need to isolate the last four cells on each row, store those values in a variable, and then make a link using the text in each cell (url + “/“ + text variable + “>” text variable + “</a>”). This link will be unique to each cell and needs to overwrite current cell text in all of last 4 cells of each row in the table. It will eventually be called on an onload event but onclick event is fine for now (testing etc). This needs to be a JavaScript function or jQuery.
I have searched for a long time trying every possible way to do this and can come close but I can’t seal the deal. Any help would be greatly appreciated. The url for the table I’m working with is: http://mak-a-key.com/wp-content/themes/theme49645/tables/table-links.html
When you create the table, you can use the callback function createdCell and modify the cell's DOM.
cellData: gives you the actual data in the current cell
rowData: gives you the actual array of data in the current row
if you need the last 4 in one, just concatenate :
rowData.nameCell2 + rowData.nameCell3.... and use it in the URL part.
Example:
$('yourTable').DataTable({
columns: [
{data: 'dataCell1'},
{data: 'dataCell2',
createdCell: function(td, cellData, rowData, row, col){
// rowData contains all information for the actual row
// cellData contains information in your actual cell
$(td).html("");
}
}
]
});
Been looking around and I cant seem to find an answer to this so maybe im wording it wrong but here it goes.
So I have a table displaying data from a database. In jQuery I have made it so a row can be added with empty inputs and then submitted to the database, this works fine.
I am now attempting to be able to edit it. So each row will have a button to edit that row, the button will put the row values into inputs so you can change the value and update the database. How can I do this? I was looking into using this here but Im not sure how I can get the value of the input boxes without them having some sort of ID.
jQuery I was trying to use:
$('#tbl').on('click','.xx',function() {
$(this).siblings().each(
function(){
if ($(this).find('input').length){
$(this).text($(this).find('input').val());
}
else {
var t = $(this).text();
$(this).text('').append($('<input />',{'value' : t}).val(t));
}
});
});
Am I over thinking this? Should I just be grabbing the values and then putting them in pre-made input boxes?
Update:
HTML:
sb.AppendLine("<table style='width: 80%;'>")
sb.AppendLine("<tr class='inputRowbelow'>")
sb.AppendLine("<td style='width: 20%;' class='ui-widget-header ui-corner-all'>Area</td>")
sb.AppendLine("<td class='ui-widget-header ui-corner-all'>Details</td>")
sb.AppendLine("<td class='ui-widget-header ui-corner-all'>Options</td>")
sb.AppendLine("</tr>")
For Each w In workItems
sb.AppendLine("<tr>")
sb.AppendLine("<td>" & w.area & "</td>")
sb.AppendLine("<td>" & w.details & "</td>")
sb.AppendLine("<td><a href='#' class='fg-button ui-state-default ui-corner-all edit'><img src='/images/spacer.gif' class='ui-icon ui-icon-pencil' /></a></td>")
sb.AppendLine("</tr>")
Next
sb.AppendLine("</table>")
There are a couple of ways to do this, including changing your VB code to add extra data to the html, but I will answer this from a pure javascript/JQuery solution.
First of all you need to handle the click event for each edit button, after that you find the matching row, and then you can get the first to td elements of that row...
$(".edit").click(function(e){
e.preventDefault();//prevent the link from navigating the page
var button = $(this);//get the button element
var row = button.closest("tr");//get the row that the button belongs to
var cellArea = row.find("td:eq(0)");//get the first cell (area)
var cellDetails = row.find("td:eq(1)");//get the second cell (details)
//now you can change these to your inputs and process who you want
//something like this...
ConvertToInput(cellArea, "area");
ConvertToInput(cellDetails, "details");
});
function ConvertToInput(element, newId){
var input = $("<input/>");//create a new input element
input.attr("id", newId);//set an id so we can find it
var val = element.html();//get the current value of the cell
input.val(val);//set the input value to match the existing cell
element.html(input);//change the cell content to the new input element
}
Here is a working example
From that you can then do the saving that you say you have already implemented, using the ID values of each field to get the values to save.
Instead of using a For Each ... in ... Next loop, use a a For loop with a counter. give each button and each row an ID with the current counter value at the end. You can then use Jquery to make each row editable separately, because each row has a row number now.
I'm trying to add values to a table using jQuery - unfortunately, I don't know how to get jQuery to add table cells to an existing row. For example:
$("<td><a href='#'>" + key + "</a></td>").click(function(e) {
e.preventDefault();
testset(key);
}).appendTo('#table1');
This adds cells to the end of the table with id table1. What would be the best way to go about adding cells to an existing table row (<tr>) using jQuery? Quick google hasn't revealed anything.
Regards,
SystemError
.appendTo('#table1 #rowId');
Or you could do:
.appendTo('#table1 tr:nth-child(5)');
http://api.jquery.com/nth-child-selector/
You must append them to a specific row and not to the table:
$("<td><a href='#'>" + key + "</a></td>").click(function(e) {
e.preventDefault();
testset(key);
}).appendTo('#table1 tr#yourrowId');