Develop Reference

appenChild is not a function in my php page

Hello everyone why it returns "appenChild is not a function?"
function showBooks(ajax) {
var books = ajax.responseXML.getElementsByTagName("book");
for (var i = 0; i < books.length; i++) {
var titleNode = books[i].getElementsByTagName("title")[0];
var authorNode = books[i].getElementsByTagName("author")[0];
var title = titleNode.firstChild.nodeValue;
var author = authorNode.firstChild.nodeValue;
var year = books[i].getAttribute("year");
var li = document.createElement("li");
li.innerHTML = title + ", by " + author + " (" + year + ")";
$("books").appendChild(li);
}
In a page where i don't include theese it works. If I include theese js it doesn't work. I need all theese javascript
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
<script src="js/bootstrap.min.js" ></script>
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Plugin JavaScript -->
<script src="vendor/jquery-easing/jquery.easing.min.js"></script>
I can't work so much on javascript, sorry

$("books") is a jQuery Object, not a HTMLElement, so it does not have HTMLElement Methods, like appendChild. What jQuery Objects have is $(...).append(), which works for your case:
function showBooks(ajax) {
var books = ajax.responseXML.getElementsByTagName("book");
for (var i = 0; i < books.length; i++) {
var titleNode = books[i].getElementsByTagName("title")[0];
var authorNode = books[i].getElementsByTagName("author")[0];
var title = titleNode.firstChild.nodeValue;
var author = authorNode.firstChild.nodeValue;
var year = books[i].getAttribute("year");
var li = document.createElement("li");
li.innerHTML = title + ", by " + author + " (" + year + ")";
$("#books").append(li); // use jQuery append method instead of appendChild
}
}
Or you can get the underlying HTMLElement, and use appendChild on it:
function showBooks(ajax) {
var books = ajax.responseXML.getElementsByTagName("book");
for (var i = 0; i < books.length; i++) {
var titleNode = books[i].getElementsByTagName("title")[0];
var authorNode = books[i].getElementsByTagName("author")[0];
var title = titleNode.firstChild.nodeValue;
var author = authorNode.firstChild.nodeValue;
var year = books[i].getAttribute("year");
var li = document.createElement("li");
li.innerHTML = title + ", by " + author + " (" + year + ")";
$("#books").get(0).appendChild(li)); // use appendChild on the HTMLElement
}
}

javascript - unable to populate 2D array

My instructor tasked us to build a 2D array and populate it with values from our HTML form. He gave us this example to create the array.
var tasks = new Array();
var index = 0;
He then said to insert the values into the two columns using this code.
tasks[index]["Date"] = tempdate;
tasks[index]["Task"] = temptask;
However, something about these two lines is causing the script to break, because when I comment them out the final line of my script returns a value to the correct div. When I uncomment these lines no value is returned. Is there something wrong in my syntax?
This is my complete js file:
var tasks = new Array();
var index = 0;
function addTask() {
var tempdate = new Date();
var temptask = document.getElementById("taskinfo").value;
var td = document.getElementById("taskdate").value;
tempdate = td + " 00:00";
tasks[index]["Date"] = tempdate;
tasks[index]["Task"] = temptask;
index++
tasks.sort(function (a, b) { return b.date - a.date });
var tablecode = "<table class = 'tasktable'>" +
"<tr>"+
"<th>Date</th>"+
"<th>Task</th>"+
"</tr>";
for (var i = 0; i < tasks.length; i++) {
tablecode = tablecode + "<tr>" +
"<td>" + tasks[i]["Date"].toDateString() + " </td>" +
"<td>" + tasks[i]["Task"] + " </td>" +
"</tr>";
}
tablecode = tablecode + "</table>";
//I am only returning "temptask" to test with, I will be returning "tablecode".
document.getElementById("bottomright").innerHTML = temptask;
return false;
}

tasks[index] (in the first case, tasks[0]) doesn't yet exist, so you can't give it properties. Try this to create an object and assign it to tasks[index]:
tasks[index] = {
Date: tempdate,
Task: temptask
};
in place of
tasks[index]["Date"] = tempdate;
tasks[index]["Task"] = temptask;
Alternatively, you can use
tasks[index] = {};
tasks[index]["Date"] = tempdate;
tasks[index]["Task"] = temptask;

Can anyone help me understand this logic please?

var array1 = new Array(3,5,2,7,6);
var array2 = new Array(5);
var i;
for(i=0; i<array1.length; i++) {
array2[array2.length-i-1] = array1[i%3+1];
}
document.writeln(array2);
the output is as follows: 2,5,7,2,5
I'm a bit confused on this, any help would be appreciated thanks.

It's easy to debug stuff... Just display more data along the way so you can see what stuff is
Click Run code snippet... to see it run
document.write("<pre>");
var array1 = new Array(3,5,2,7,6);
var array2 = new Array(5);
var i;
for(i=0; i<array1.length; i++) {
document.writeln("array2[" + array2.length + "-" + i + "-" + "1] = array1[" + i + "%" + "3+1];");
document.writeln("array2[" + (array2.length-i-1) + "] = array1[" + (i%3+1) + "];");
document.writeln(array2);
document.writeln();
array2[array2.length-i-1] = array1[i%3+1];
}
document.writeln("final");
document.writeln(array2);

Export array of objects into Excel using Javascript

I'm writing a client side method, that creates an array of objects.I open an existing excel to write the values from the array. I get the values using getProperty and store in a variable.
When I try to write those in the excel, I get "event handler failed with message";" ".
Code:
var getItemtoExcel = document.thisItem.newItem("ToExcel", "get");
getItemtoExcel = getItemtoExcel.apply();
var arrToExcel = Array();
for (var j = 0; j < getItemtoExcel.getItemCount(); j++) {
var gotItemForExcel = getItemtoExcel.getItemByIndex(j);
arrToExcel.push(gotItemForExcel);
}
var Excel = new ActiveXObject("Excel.Application");
Excel.Visible = true;
Excel.Workbooks.Open("C:\\test.xls");
var offset = 0;
var row = 2;
for (var c = 0; c < arrToExcel.length; c++) {
var createExcel = arrToExcel[c];
var Number = createExcel.getProperty("nb");
var Type = createExcel.getProperty("type");
var Code = createExcel.getProperty("code");
var State = createExcel.getProperty("state");
Excel.Worksheets("sheet11").Range("A" & row + 1 + offset).Value = Number;
Excel.Worksheets("sheet11").Range("B" & row + 1 + offset).Value = Type;
Excel.Worksheets("sheet11").Range("C" & row + 1 + offset).Value = Code;
Excel.Worksheets("sheet11").Range("D" & row + 1 + offset).Value = State;
row = row + 1;
}
offset = offset + 1;
return this;
document.thisItem.newItem() is from ARASPLM. Its the standard used to call an ItemType(Item) in ARAS

If you have an opportunity to use SheetJS, it's pretty straightforward
Firstly, Install xlsx package npm install --save xlsx
const XLSX = require('xlsx')
// array of objects to save in Excel
let binary_univers = [{'name': 'Hi','value':1},{'name':'Bye','value':0}]
let binaryWS = XLSX.utils.json_to_sheet(binary_univers);
// Create a new Workbook
var wb = XLSX.utils.book_new()
// Name your sheet
XLSX.utils.book_append_sheet(wb, binaryWS, 'Binary values')
// export your excel
XLSX.writeFile(wb, 'Binaire.xlsx');

i think using this you can get what you want but you need to pass the your Object's value with this that i have mentioned here as (Your Data(Object))
window.open('data:application/vnd.ms-excel,' + **(Your Data(Object))**);
here i'm providing simple code for get data into excel format with jquery
SAMPLE DEMO

Thanks for all your suggestions on this question.
I have done with exporting the array into a .csv file successfully.
Here's the code, for others who will need.
var getItemtoExcel=this.newItem("MyForm", "get");
getItemtoExcel=getItemtoExcel.apply();
var arrToExcel = Array();
for (var j=0; j<getItemtoExcel.getItemCount(); j++)
{
var gotItemForExcel=getItemtoExcel.getItemByIndex(j);
arrToExcel.push(gotItemForExcel);
}
var fso = new ActiveXObject("Scripting.FileSystemObject");
var s = fso.CreateTextFile("C:\\REPORT.csv", true);
var title="Report";
s.WriteLine(title);
var header="Number" + ";" + "Type" + ";" + "Code" + ";" + "Created On" + ";" + "State" + '\n' ;
s.WriteLine(header);
for (var c=0; c<arrToExcel.length; c++){
var createExcel = arrToExcel[c];
var Number =createExcel.getProperty("nb");
var Type=createExcel.getProperty("type");
if(Type===undefined){Type="";}
var Code=createExcel.getProperty("code");
if(Code===undefined){Code="";}
var Date=createExcel.getProperty("created_on");
var State=createExcel.getProperty("created_by_id/#keyed_name");
var value=Number + ";" + Type + ";" + Code + ";" + Date + ";" + State;
s.WriteLine(value);
}
s.Close();
alert("Report Saved as C:\\REPORT.csv");
return this;

Full image source concatenation in Javascript

How do I get full image source (like "http://lorempixel.com/400/200/sports/1") by concatenation of partial source:
var url = "http://lorempixel.com/400/200/sports/"
and numbers from array
var arr = [1,2,3,4,5];
I already have list of images
<ul id="imageList"></ul>
I want to append images like this
for (var i = 0; i < arr.length; i++) {
$('#imageList').append('<li><img class="imageClass" src = "url + 'arr[i]'" /></li>');
}
Here source concat. is not working

This is because you did not use url and arr[i] as a variable by closing the string before concatenating the variables with a +.
.append('<li><img class="imageClass" src="' + url + arr[i] + '" /></li>');
If you have a text editor that highlights your code for you, url and arr[i] should be in a different colour.
Demo: http://jsfiddle.net/WLv6F/

You can set the src of the image using JavaScript:
var arr = [1,2,3,4,5];
var url = "http://lorempixel.com/400/200/sports/" + arr[0];
var img = document.createElement('img');
img.className = 'imageClass';
img.src = url;
By looping through your array elements, you can append them to your list. Here I show two methods of looping: Array.prototype.forEach and also a for loop if that's what you prefer:
var url = "http://lorempixel.com/400/200/sports/";
var arr = [1, 2, 3, 4, 5], img, listItem;
// Using foreach
arr.forEach(function(id) {
listItem = document.createElement('li');
img = document.createElement('img');
img.className = 'imageClass';
img.src = url + id;
listItem.appendChild(img);
document.getElementById('imageList').appendChild(listItem);
});
// Using for
for (var i = 0; i < arr.length; ++i) {
listItem = document.createElement('li');
img = document.createElement('img');
img.className = 'imageClass';
img.src = url + arr[i];
listItem.appendChild(img);
document.getElementById('imageList').appendChild(listItem);
}

"src = '" + url + arr[0] + "'/>"
Edit:
He has it wrong with:
'<li><img class="imageClass" src = "url + 'arr[i]'" /></li>'
It should be:
'<li><img class="imageClass" src = "' + url + arr[i] + '" /></li>'