repeat xml data into a div - javascript

I have a function which retrieve data from a xml file and then it is supposed to show it in a div. The problem is that I only get the last element of the array. Is there a way to obtain all the elements and populate them into the div?
Here is the function:
function paradascamionesHistorico() {
google.maps.event.addListener(map, 'click', function() {
infowindowMarkerParadas.close();
});
var Boton = document.getElementById('Boton').value;
var textboxImei = document.getElementById('imeiHistorico').value;
var textboxFecha = document.getElementById('fechaInicioHistorico').value;
var textboxFechaFin = document.getElementById('fechaFinHistorico').value;
var textboxDesdeHora = document.getElementById('desdeHoraHistorico').value;
var textboxHastaHora = document.getElementById('hastaHoraHistorico').value;
downloadUrl("paradas.asp?imei="+textboxImei+"&fecha="+textboxFecha+" "+textboxDesdeHora+"&fechaFin="+textboxFechaFin+" "+textboxHastaHora,
function(data) {
var xml = xmlParse(data);
var markersParadas = xml.documentElement.getElementsByTagName("marker");
var position = [];
//var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markersParadas.length; i++) {
var lat = parseFloat(markersParadas[i].getAttribute("lat"));
var lng = parseFloat(markersParadas[i].getAttribute("lng"));
var myLatlngParadas = new google.maps.LatLng(lat, lng);
var fechaInicio = markersParadas[i].getAttribute("fechaInicio");
var fechaFinal = markersParadas[i].getAttribute("fechaFinal");
var diferencia = markersParadas[i].getAttribute("diferencia");
//alert(+diferencia);
var datearray = diferencia.split("/");
var newDate = datearray[1] + '/' + datearray[0] + '/' + datearray[2];
var aFecha = new Date(newDate);
var hours = aFecha.getHours();
var minutes = aFecha.getMinutes();
var seconds = aFecha.getSeconds();
var markerParadas = createMarkerParadas(myLatlngParadas, hours, minutes, seconds, fechaInicio, fechaFinal);
myMarkersParadas.push(markerParadas);
var tablaParadas = '<a href="javascript:myclickParadas(' + (myMarkersParadas.length-1) + ')">' + seconds + '<\/a><br>';
document.getElementById("paradasDiv").innerHTML = tablaParadas;
}//finish loop
}); //end download url
}//termina function
function myclickParadas(i) {
google.maps.event.trigger(myMarkersParadas[i], "click");
}
So if anyone knows how to show the rest of the elements of the array I will be very gratefully.
Best regards.

document.getElementById("paradasDiv").innerHTML = tablaParadas;
You are overwriting innerHTML of #paradasDiv on each iteration of your loop.
That's why you only see the last element of the array.
You have to append to it:
document.getElementById("paradasDiv").innerHTML += tablaParadas;
Also, before starting the loop you maybe need to empty it:
document.getElementById("paradasDiv").innerHTML = '';

Related

Javascript - setValue returns #ERROR into a cell

I'm really new to Javascript and pretty much copied most of the code and modified it a bit. Sometimes I'm getting an error putted into a cell and sometimes the correct values. Do you know what is the issue?
for (p=3; p < 19; p=p+3){
var Value = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(9,p);
var outputValue = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(counter.getValue(),(3 + a));
outputValue.setValue(Value.getValue());
a = a +1;}
I'm adding the whole code as well for reference:
function getData() {
var queryString = Math.random();
var i;
for (i=2; i < 8; i++) {
var AddressColumn = SpreadsheetApp.getActiveSheet().getRange("W1").getColumn();
//if (ValueCrypto>0)
var cellFunction1 = '=Value(Replace(IMPORTXML("' + SpreadsheetApp.getActiveSheet().getRange(i,AddressColumn).getValue() + '?' + queryString + '","'+ SpreadsheetApp.getActiveSheet().getRange(1,AddressColumn).getValue() + '"),1,1,))*X1';
SpreadsheetApp.getActiveSheet().getRange(i,3).clearContent(); // You can also use range.setFormula("");
SpreadsheetApp.flush();
SpreadsheetApp.getActiveSheet().getRange(i,3).setValue(cellFunction1);
var cellFunction2 = '=Value(Replace(IMPORTXML("' + SpreadsheetApp.getActiveSheet().getRange(i,AddressColumn).getValue() + '?' + queryString + '","'+ SpreadsheetApp.getActiveSheet().getRange(1,AddressColumn).getValue() + '"),1,1,))';
SpreadsheetApp.getActiveSheet().getRange(i,8).clearContent(); // You can also use range.setFormula("");
SpreadsheetApp.flush();
SpreadsheetApp.getActiveSheet().getRange(i,8).setValue(cellFunction2);
}
//var cellFunction2 = '=IMPORTXML("' + SpreadsheetApp.getActiveSheet().getRange('A4').getValue() + '?' + queryString + '","'+ SpreadsheetApp.getActiveSheet().getRange('A5').getValue() + '")';
//SpreadsheetApp.getActiveSheet().getRange('C2').setValue(cellFunction2);
counter2 = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange("A12").getValue();
SpreadsheetApp.getActiveSheet().getRange("A12").setValue(counter2+1)
if (counter2 = 3) {recordValue();}
}
function recordValue() {
SpreadsheetApp.getActiveSheet().getRange("A12").setValue(0);
var counter = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange("A13");
//console.log(counter)
var dateCell = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(counter.getValue(),2);
dateCell.setValue(new Date());
//const errorValues = ["#N/A", "#REF", "#ERROR!"];
var a = 0;
for (p=3; p < 19; p=p+3){
var Value = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(9,p);
var outputValue = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(counter.getValue(),(3 + a));
outputValue.setValue(Value.getValue());
a = a +1;
}
var TotalValue = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange("R2");
var outputTotalValue = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(counter.getValue(),17);
outputTotalValue.setValue(TotalValue.getValue());
var TotalValue2 = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange("R5");
var outputTotalValue2 = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1").getRange(counter.getValue(),18);
outputTotalValue2.setValue(TotalValue2.getValue());
counter.setValue(counter.getValue() + 1);
if(counter.getValue() > 300){counter.setValue("14");}}

Google Apps Script - Setting a row to complete only after it's been ran through the loop

I have Google Apps Script which inputs events into my google calendar from a spreadsheet. Anyone know how to have the script set a row's background color to green & last column value to "complete" only if it's been ran through the loop?
Currently I have it just setting the full range to these parameters, but would like to prevent certain rows from being included if the last column is equal to "Invalid".
function inputEvents() {
var spreadsheet = SpreadsheetApp.getActiveSheet();
var calendarId = spreadsheet.getRange("B1").getValue();
var calendar = CalendarApp.getCalendarById(calendarId)
var lr = spreadsheet.getLastRow();
var count = spreadsheet.getRange("A3:AF"+lr+"").getValues();
for (x=0; x<count.length; x++) {
var events = count[x];
var name = events[2];
var phone = events[3];
var email = events[4];
var title = events[5];
var startTime = events[6];
var endTime = events[7];
var description = events[8];
var location = events[9];
var eventId = events[31];
var contactHeader = "CONTACT:";
var descriptionHeader = "DESCRIPTION:";
var complete = "Complete";
var invalid = "Invalid";
var info =
contactHeader.bold() + "\n"
+ name + "\n"
+ phone + "\n"
+ email + "\n"
+ "\n" + descriptionHeader.bold() + "\n"
+ description;
var options = {
'guests' : email,
'description': info,
'sendInvites': 'True',
'location': location,
}
if (eventId != complete && eventId != invalid){
calendar.createEvent(title, startTime, endTime, options);
spreadsheet.getRange("AF3:AF"+lr+"").activate().setValue('Complete');
spreadsheet.getRange("A3:AF"+lr+"").activate().setBackground('#d9ead3');
}
}
}
You're using the setValue and setBackground methods to the entire range, you need to apply them only to the range you're interested in, try setting a currentRow variable and change the range you're getting inside your if statement, like this:
var currentRow = 3 + x;
if (eventId != complete && eventId != invalid){
calendar.createEvent(title, startTime, endTime, options);
spreadsheet.getRange("AF" + currentRow).setValue('Complete');
spreadsheet.getRange("A"+ currentRow + ":AF" + currentRow).setBackground('#d9ead3');
}

How do I access variable while looping through

I have this piece of code
(function() {
'use strict';
// Returns current URL page.
var currentURL = window.location.protocol + "//" + window.location.host + "/" +
window.location.pathname + window.location.search
var market_table = document.getElementById("market_item_table");
var market_table_cells = document.getElementsByTagName("td");
var rowLength = market_table.rows.length;
var items = document.querySelectorAll('div[data-item-id]')
var j = 0;
items.forEach(function(getItem) {
var itemData = items[j].dataset;
var tooltip = JSON.parse(itemData.tooltip)[0][0][0];
console.log(tooltip);
j++
});
for (var i = 1; i < rowLength; i++) {
var oCells = market_table.rows.item(i).cells;
console.log("Paka nr. " + i + "Nazwa przedmiotu: " + tooltip + ' ' +
oCells[1].innerText + ' ' + oCells[2].innerText);
}
})();
Now how would I go about and get the value of variable tooltip every time it loops through the NodeList?
The bigger picture is that I want to assign the correct names to the correct items listed.
You can set up an array outside of the for loop that stores the values of the tooltips, then use it in a separate function:
var tooltips = [];
Items.forEach(function(getItem) {
var itemData = getItem.dataset;
var tooltip = JSON.parse(itemData.tooltip)[0][0][0];
console.log(tooltip);
});
for (var i=0; i < rowlength... {
// Do something with the tooltips
console.log(tooltips[i]);
}

Loop overring variable each time

I'm looping through to get a load of long/lats from google directions. However, longArr and latArr only ever have one result in at the end, it's as if the var is getting cleared out each time
function showSteps(directionResult) {
// For each step, place a marker, and add the text to the marker's
// info window. Also attach the marker to an array so we
// can keep track of it and remove it when calculating new
// routes.
var myRoute = directionResult.routes[0].legs[0];
var longArr = "";
var latArr = "";
for (var i = 0; i < myRoute.steps.length; i++) {
var Long = myRoute.steps[i].lat_lngs[0].B;
var Lat = myRoute.steps[i].lat_lngs[0].k;
longArr = Long + Long + "|";
latArr = Lat + Lat + "|";
alert(longArr);
var marker = new google.maps.Marker({
position: myRoute.steps[i].start_location,
map: map
});
attachInstructionText(marker, myRoute.steps[i].instructions);
markerArray[i] = marker;
}
$('.long').val(longArr);
$('.lat').val(latArr);
}
First you need to declare your arrays as arrays.
var longArr = [];
var latArr = [];
Then you need to append to them
longArr.push(Long + Long);
latArr.push(Lat + Lat);
When writing the array out to string use join
$('.long').val(longArr.join('|'));
$('.lat').val(latArr.join('|');
To concatenate with the existing value of the string you have to concatenate the variable too.
Option 1:
longArr = longArr + Long + Long + "|" ;
latArr = latArr + Lat + Lat + "|";
Option 2:
longArr += Long + Long + "|" ;
latArr += Lat + Lat + "|";

if statement inside for loop in javascript

I'm trying to learn javascript and getting hung up on this. Basically trying to run the loop and only select the values if profile[i] equals another variable named pro.
Here is the code that selects everything.
downloadUrl("phpsqlajax_genxml.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
var pro="<?php echo $inform['profile']; ?>";
for (var i = 0; i < markers.length; i++) {
var profile = markers[i].getAttribute("profile");
var date = markers[i].getAttribute("date");
var catch1 = markers[i].getAttribute("catch1");
var catch2 = markers[i].getAttribute("catch2");
var catch3 = markers[i].getAttribute("catch3");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("latit")),
parseFloat(markers[i].getAttribute("longit")));
var html = "<b>" + date + "</b> <br/>" + catch1 + "<br/>" + catch2 + "<br/>" + catch3;
var marker = new google.maps.Marker({
map: map,
position: point,
});
bindInfoWindow(marker, map, infoWindow, html);
I tried adding
if (profile['i'] = pro)
{
after
var profile = markers[i].getAttribute("profile");
but it still loops through the whole thing.
Any suggestions?
You are assigning instead of comparing. Use == instead.
var profile = markers[i].getAttribute("profile");
if (profile['i'] == pro)
{
var date = markers[i].getAttribute("date");
var catch1 = markers[i].getAttribute("catch1");
}

Categories

Resources