How to get id from an innerHTML in javascript? - javascript

I have written the following function.
There are controls inside Table which is inside a div.
I need to print id of all the controls
function getID() {
debugger;
var ids = [];
var children = document.getElementById("divAlarmSection").children;
for (var i = 0, len = children.length; i < len; i++) {
ids.push(children[i].id);
var table = document.getElementById(children[i].id);
var rows = table.rows;
for (i = 0, n = rows.length; i < n; ++i) {
var cells = rows[i].getElementsByTagName('td');
for (var x = 0; x < cells.length; x++) {
if (cells[x].length != 0) {
alert(cells[x].innerHTML);
}
}
}
}

use .getElementsByTagName("*") on cells[x] and access 'ID' property of the result. So your last 'for' loop becomes:
var elements = cells[x].getElementsByTagName("*")
for(var len=0;len<elements.length;len++)
console.log(elements[len].id);
Also, if you know the inner structure of each 's and its consistent, you can look for that element in .getElementsByTagName()

Related

Remove table if contains string

I am looking to automatically remove tables in slides if they contain a specific text string. This is what I currently have, but for some reason, the findText() doesn't seem to work and I can't figure out an alternative to this...
function removeUnwantedTables() {
var gotSlides =
SlidesApp.openById('1gJjGBbaQXWhP8uhVIoccV2h_RL7_gsxvg_NW-qNCcLU').getSlides();
for (var i = 0; i < gotSlides.length; i++) {
var slide = gotSlides[i];
var tables = slide.getTables();
for (var k = 0; k < tables.length; k++) {
var allTables = tables[k];
if (allTables.findText('{{remove-this-table}}') > 0) {
allTables.remove();
}
}
}
}
Does anyone have a solution to this?
How about this modification? I think that there may be several answers. So please think of this as one of them.
Modification points :
Using getCell(), each cell are retrieved and compared to the string of {{remove-this-table}}.
I couldn't find the method for directly searching the string from a table. So I used this.
When {{remove-this-table}} is found, the table is removed and the for loop is broken away.
Modified script :
function removeUnwantedTables() {
var gotSlides = SlidesApp.openById('1gJjGBbaQXWhP8uhVIoccV2h_RL7_gsxvg_NW-qNCcLU').getSlides();
for (var i = 0; i < gotSlides.length; i++) {
var slide = gotSlides[i];
var tables = slide.getTables();
if (tables.length > 0) {
for (var k = 0; k < tables.length; k++) {
var allTables = tables[k];
row = allTables.getNumRows();
col = allTables.getNumColumns();
var values = [];
for (var r = 0; r < row; r++) {
for (var c = 0; c < col; c++) {
var v = allTables.getCell(r, c).getText().asString();
if (v.indexOf("{{remove-this-table}}") > -1) {
values.push(v);
break;
}
}
if (values.length > 0) {
allTables.remove();
break;
}
}
}
}
}
}
If this was not what you want, I'm sorry.

Cant select html elements created as a template with javascript

I created a table with java script, of rows and cols, basically a template for seats, but when I try to select the html elements, using document.getELementbyclassname, I get undefined. I am using every in j query $(document).ready(function), still I get undefined.
function createTemplate(rows,cols){
var rows = rows;
var col = cols;
for(var i = 0; i < rows; i++){
$("#container").append("<div class = 'row rower'></div>");
}
for(var y = 0; y < col; y++){
$(".rower").append("<div class = 'col-xs-1 cols'> </div>");
}
for(var z = 0; z < 1; z++){
$(".cols").append("<button class = 'btn btn-danger proness'></button>");
}
var buttons = document.getElementsByClassName("proness");
for(var l = 0; l < buttons.length; l++){
buttons[l].innerHTML = l;
}
var row = document.getElementsByClassName("rower");
for(var x = 0; x < row.length;x++)
{
row[x].style.padding = "1px";
}
};
Now, after i use
var button = document.getElementByClassName("btn");
console.log(button[3]); // UNdefined
Since you're using jquery already, you can use jquery to address the buttons.
Fiddle: https://jsfiddle.net/j6ju2cxs/
var buttons = $(".btn");
console.log($(buttons[3]).html());
If the number of cells that result from the rows and columns input into your function is less than 3, looking for buttons[3] will return undefined.

checking data attribute in a array

I have a list of events on a page. My end goal is to hide a purchase button (by adding a class to it) if the event has passed, using JQuery/Javascript. Each event has a 3 data attributes(month, day, year). I tried using the following method to cycle through an array:
var matches = document.querySelectorAll(".event-event");
var i = 0;
for (i = 0; i < matches.length; i++) {
var event = matches[i].getElementsByClassName('date');
var eventDate = event.getAttribute('data-date');
}
But it says that "getAttribute" is not a function, I've also tried ".attr" and it said the same thing.
var matches = document.querySelectorAll(".event-event");
for (var i = 0; i < matches.length; i++) {
var event = matches[i].getElementsByClassName('date');
if (event.length > 0) {
for (var j = 0; j < event.length; j++) {
var eventDate = event[i].getAttribute('data-date');
}
}
}
The getElementsByClassName method returns an array.
Try this:
var matches = document.querySelectorAll(".event-event");
for (var i = 0; i < matches.length; i++) {
var events = matches[i].getElementsByClassName('date');
for(var j = 0; j < events.length; j++) {
var eventDate = events[j].getAttribute('data-date');
}
}
events is an array that you must iterate through.

Handling multidimentional array in java script is not working

function split(str)
{
var array = str.split(';');
var test[][] = new Array();
for(var i = 0; i < array.length; i++)
{
var arr = array[i].split(',');
for(var j = 0; j < arr.length; j++)
{
test[i][j]=arr[j];
}
}
}
onchange="split('1,2,3;4,5,6;7,8,9;a,b,c;d,e,f;g,h,i')"
it was not working. i need to split this string to 6*3 multi dimentional array
var array[][] = new Array() is not valid syntax for declaring arrays. Javascript arrays are one dimensional leaving you to nest them. Which means you need to insert a new array into each slot yourself before you can start appending to it.
Like this: http://jsfiddle.net/Squeegy/ShWGB/
function split(str) {
var lines = str.split(';');
var test = [];
for(var i = 0; i < lines.length; i++) {
if (typeof test[i] === 'undefined') {
test[i] = [];
}
var line = lines[i].split(',');
for(var j = 0; j < line.length; j++) {
test[i][j] = line[j];
}
}
return test;
}
console.log(split('a,b,c;d,e,f'));
var test[][] is an invalid javascript syntax.
To create a 2D array, which is an array of array, just declare your array and push arrays into it.
Something like this:
var myArr = new Array(10);
for (var i = 0; i < 10; i++) {
myArr[i] = new Array(20);
}
I'll let you apply this to your problem. Also, I don't like the name of your function, try to use something different from the standards, to avoid confusion when you read your code days or months from now.
function split(str)
{
var array = str.split(';'),
length = array.length;
for (var i = 0; i < length; i++) array[i] = array[i].split(',');
return array;
}
Here's the fiddle: http://jsfiddle.net/AbXNk/
var str='1,2,3;4,5,6;7,8,9;a,b,c;d,e,f;g,h,i';
var arr=str.split(";");
for(var i=0;i<arr.length;i++)arr[i]=arr[i].split(",");
Now arr is an array with 6 elements and each element contain array with 3 elements.
Accessing element:
alert(arr[4][2]); // letter "f" displayed

html form values to a javascript array

how to insert values in a html table, an array multidimensional in javascript.
Additionally, such as performing calculations between the columns of the array and insert the results into a column of the same array.
thanks for your answers.
Javascript code:
var multiArray;
window.onload = function() {
// load the table into the multidimensional array.
multiArray = [];
var trs = document.getElementsByTagName('TR');
for(var i = 0; i < trs.length; i++) {
var arr = [];
var tds = trs[i].childNodes;
for(var j = 0; j < tds.length; j++) {
var td = tds[j];
if (td.tagName === 'TD') {
arr.push(td.innerHTML);
}
}
multiArray.push(arr);
}
// perform some calculations between the columns of the array
var resCalc = [];
for(i = 0; i < multiArray.length; i++) {
resCalc[i] = 0;
for(j = 0; j < multiArray[i].length; j++) {
resCalc[i] += multiArray[i][j];
}
}
// insert the results into a column of the same array
var columnToModify = 0; // the index of the column you want to change
for(i = 0; i < multiArray.length; i++) {
multiArray[i][columnToModify] = resCalc[i];
}
};
something on Google…
http://www.eggheadcafe.com/community/aspnet/3/10003047/html-table-in-to-an-array.aspx

Categories

Resources