Using the following syntax, I was hoping to add a third and fourth row to my DataTables footer.
var secondRow = $(nRow).next()[0];
var nCells = secondRow.getElementsByTagName('td');
*var thirdRow = $(nRow).next()[1];
var nCells = thirdRow.getElementsByTagName('td');
var fourthRow = $(nRow).next()[2];
var nCells = forthRow.getElementsByTagName('td');*
While the second row works, the third triggers an error. "thirdRow" is undefined.
Is there a way to add multiple rows within the footer callback?
$(row).next() returns a single JQuery object not an array of them, and as with all JQuery objects you can access the underlying JavaScript object by getting the first element of it, and you then execute a JavaScript (not JQuery) function to get the cells.
You could I suppose use your selected element to find the next one
const secondRow = $(nRow).next()[0];
const nCells = secondRow.getElementsByTagName('td');
const thirdRow = $(secondRow).next()[0];
const nCells = thirdRow.getElementsByTagName('td');
but your question is a little bit confusing because you talk about adding new elements to your page but your code is for selecting existing elements from the page.
https://api.jquery.com/next/
Related
I am functional component I am using hooks to update the state of the array locationData
const c = {
title: inputValue,
}
setLocationData([...locationData, c]);
This is working fine, but now I want to add the value at the beginning of the array, and not at the end.
Edit:
I also have a problem to delete an item from the array. I want to delete one item, but more are deleted
const deleteItem = (index) => {
console.log(index)
var temp = locationData;
var temp = locationData.splice(index, 1);
setLocationData(temp);
}
You are almost there, just switch the position in the array.
setLocationData([c, ...locationData]);
You should also be aware of other methods like splice, slice, push, pop etc...
Update: Using Splice
This relates to part 2 of your question with regards to removing from specific index.
The splice() method changes the contents of an array by removing or
replacing existing elements and/or adding new elements in place. To
access part of an array without modifying it, see slice().
So your codes should be similar to the following
var temp = [...locationData];
temp.splice(index, 1);
setLocationData(temp);
I am currently trying to pull in data from a website into my Google Sheet, however, it will automatically pull the data on whatever tab I am on when the sheet updates.
The script I currently have is below. I have 5 tabs in the workbook and the tab I need updated is labeled 'Update' and is the 3rd tab in the workbook.
The data currently pulls in correctly, however, it will not only update the tab I need updated.
function getData() {
var queryString = Math.random();
var cellFunction = '=IMPORTHTML("http://www.golfchannel.com/tours/pga-tour/2017/us-open/?' + queryString + '","table",2)';
SpreadsheetApp.getActiveSheet().getRange('A1').setValue(cellFunction);
}
Change your code line to this:
SpreadsheetApp.getSheetByName('Update').getRange('A1').setValue(cellFunction);
You can set the sheet by calling the method getSheetByName().
Returns a sheet with the given name. If multiple sheets have the same name, the leftmost one is returned. Returns null if there is no sheet with the given name.
Here is a sample snippet:
function myFunction() {
var sss = SpreadsheetApp.openById('FILEID'); // sss = source spreadsheet
var ss1 = sss.getSheetByName('Sheet1');
var ss2 = sss.getSheetByName('Sheet2');
var source_range = ss1.getRange("A1:G10");
var target_range = ss2.getRange("A1:G1");
source_range.copyTo(target_range);
}
Hope this helps.
I just started using dgrid, and going through the dTunes sample, I'm unable to find the id associated with each row in the list. This is pretty remedial on my part, but how would I also get the id I sent from the datasource?
define([
'require',
'dgrid/List',
'dgrid/OnDemandGrid',
'dgrid/Selection',
'dgrid/Keyboard',
'dgrid/extensions/ColumnHider',
'dojo/_base/declare',
'dojo/_base/array',
'dojo/Stateful',
'dojo/when',
'dstore/RequestMemory',
'put-selector/put',
'dojo/domReady!'
], function (require, List, Grid, Selection,
Keyboard, Hider, declare, arrayUtil, Stateful,
when, RequestMemory, put) {
var cstsNode = put(listNode, 'div#cstsCars');
...
var cstsList = new TunesList({}, cstsNode);
var dataCSTS = new RequestMemory({ target: require.toUrl('./dataCSTS.json') });
...
dataCSTS.fetch().then(function (cars) {
cstsCars = arrayUtil.map(cars, pickField('Description'));
cstsCars.unshift('All (' + cstsCars.length + ' CSTS Cars' + (cstsCars.length !== 1 ? 's' : '') + ')');
cstsList.renderArray(cstsCars);
});
...
cstsList.on('dgrid-select', function (event) {
var row = event.rows[0];
console.log(row.id); // shows row number. How do I get the real id or other fields?
console.log(row.data); // shows row text that is displayed ("sample text 1")
console.log(row.data.id); // undefined
});
Here is a snippet of sample data like I'm supplying:
[{"id":"221","Description":"sample text 1"},
{"id":"222","Description":"sample text 2"},
{"id":"223","Description":"sample text 3"}]
I'd like to see the id. Instead, row.id returns 1,2 and 3, ie the row numbers (or id dgrid created?).
You haven't really shown a complete example, but given that you're using a store anyway, you'd have a much easier time if you let dgrid manage querying the store for you. If you use dgrid/OnDemandList (or dgrid/List plus dgrid/extensions/Pagination), you can pass your dataCSTS store to the collection property, it will render it all for you, and it will properly pick up your IDs (since Memory, and RequestMemory by extension, default to using id as their identity property).
The most appropriate place to do what you're currently doing prior to renderArray would probably be in the renderRow method if you're just using List, not Grid. (The default in List just returns a div with a text node containing whatever is passed to it; you'll be passing an object, so you'd want to dig out whatever property you actually want to display, first.)
If you want a header row, consider setting showHeader: true and implementing renderHeader. (This is false in List by default, but Grid sets it to true and implements it.)
You might want to check out the Grids and Stores tutorial.
I think the problem might be that I was modeling my code based on the dTunes sample code, which has 3 lists that behave a little differently than a regular grid.
For now, I'm using the cachingStore that is available in the lists. So the way I get the id:
cstsList.on('dgrid-select', function (event) {
var row = event.rows[0];
var id = storeCSTS.cachingStore.data[row.id - 1].id; // -1 because a header was added
console.log(id);
});
I'm not sure whether this will work if I ever try to do sorting.
I have a Google Script published as a web app which uses UI service to display an interface with several listboxes. I can get at the values selected thru server handlers.
My problem is that I need to add these values to a url in a anchor defined in my doGet routine. (I am calling a JotForm url, and need the dynamic parameters to pre-populate the form)
I can't see how to modify the anchor from the handler function, or any other way to invoke the url I build in code.
When you want to modify any widget in a Ui created with UiApp, each widget must have an ID that you can use to getElementById() and manipulate the way you want just as if you were in the doGet function.
Here is a simple example to illustrate : (online here)
function doGet(){
var app = UiApp.createApplication().setTitle('test');
var serieNames = [' serie A',' serie B',' serie C'];
var panel = app.createVerticalPanel().setStyleAttribute('padding','30px');
var namesHandler = app.createServerHandler('showPilots').addCallbackElement(panel);
for(var n in serieNames){
var serieSelect = app.createRadioButton('pilotSelect',serieNames[n]).setId('s'+n).addClickHandler(namesHandler)
panel.add(serieSelect);
}
app.add(panel);
return app;
}
function showPilots(e){
Logger.log(JSON.stringify(e));// you can see the source parameter in e that returns the widgets ID of the button you clicked to call the handler
var app = UiApp.getActiveApplication();
var serie = e.parameter.source; // get the ID
app.add(app.createLabel('you clicked '+e.parameter.source));// then get this widget by its ID and modify it
app.getElementById(serie).setText('Clicked');// modify it
return app;// update Ui
}
EDIT : here is a version that manipulates anchors, it is perfectly possible to change the url from a handler.
test here
code :
function doGet(){
var app = UiApp.createApplication().setTitle('test');
var links = ['link 1',' link 2',' link 3'];
var linkshref = ['http://www.google.com','http://www.packtpub.com/google-apps-script-for-beginners/book','http://stackoverflow.com/questions/tagged/google-apps-script'];
var panel = app.createVerticalPanel().setStyleAttribute('padding','30px');
var namesHandler = app.createServerHandler('changeUrl').addCallbackElement(panel);
for(var n in links){
var linkWidget = app.createAnchor(links[n], linkshref[n]).setId('s'+n);
panel.add(linkWidget);
}
var btn = app.createButton('change links',namesHandler);
app.add(panel.add(btn));
return app;
}
function changeUrl(e){
Logger.log(JSON.stringify(e));// you can see the source parameter in e that returns the widgets ID of the button you clicked to call the handler
var app = UiApp.getActiveApplication();
var links = ['New link 1','New link 2','new link 3'];
var linkshref = ['http://www.microsoft.com','http://www.w3schools.com/js/','https://sites.google.com/site/appsscriptexperiments/'];
for(var n in links){
app.getElementById('s'+n).setHref(linkshref[n]).setHTML(links[n]);
}
return app;// update Ui
}
I have a custom built tableview, where I am building the text in the table row by row. I have a big loop that goes through a set of XML data and builds the row based on an RSS XML feed.
Then I added an event listener to see when somone clicks on one of the rows:
tableview.addEventListener('click',function(e)
{
showrow(theid);
});
My question is, during the building of the row, how do i define theid as a variable associated with that row?
I tried a simple
var theid = item.getElementsByTagName("id").item(0).text;
in my loop, but that does work as its always set to the last item in my loop of XML entries.
Thanks!
As you are creating the TableViewRows in your loop, just add the 'theid' property to it with dot notation
var row = Ti.UI.createTableViewRow();
row.theid = item.getElementsByTagName("id").item(0).text;
row.addEventListener('click', function(e){
alert( e.source.theid );
});
Note: If you are adding additional objects on your TableViewRow (like images, labels, etc) make sure you look at the event propagation in the KitchenSink to make sure that 'e.source' is the tableViewRow and not the UI objects added to the tableViewRow
If you want to add the eventListener to the table (not the row) just check the 'rowData' of the click:
table.addEventListener('click', function(e){
alert( e.rowData.theid );
});
you should add custom variables to your row like
var newRow = Ti.UI.createTableViewRow({
title: 'my new row',
customID: item.getElementsByTagName('id').item(0).text
});
tableViewRow.add(newRow);
if that doesn't work, try this:
var newRow = Ti.UI.createTableViewRow({
title: 'my new row',
'customID': item.getElementsByTagName('id').item(0).text
});
tableViewRow.add(newRow);