We Keep Coding

Add a paragraph or table etc. at Cursor

I have a function for adding the contents of a separate google document at the cursor point within the active document, but I haven't been able to get it to work. I keep getting the "Element does not contain the specified child element" exception, and then the contents gets pasted to the bottom of the document rather than at the cursor point!
function AddTable() {
//here you need to get document id from url (Example, 1oWyVMa-8fzQ4leCrn2kIk70GT5O9pqsXsT88ZjYE_z8)
var FileTemplateFileId = "1MFG06knf__tcwHWdybaBk124Ia_Mb0gBE0Gk8e0URAM"; //Browser.inputBox("ID der Serienbriefvorlage (aus Dokumentenlink kopieren):");
var doc = DocumentApp.openById(FileTemplateFileId);
var DocName = doc.getName();
//Create copy of the template document and open it
var docCopy = DocumentApp.getActiveDocument();
var totalParagraphs = doc.getBody().getParagraphs(); // get the total number of paragraphs elements
Logger.log(totalParagraphs);
var cursor = docCopy.getCursor();
var totalElements = doc.getNumChildren();
var elements = [];
for (var j = 0; j < totalElements; ++j) {
var body = docCopy.getBody();
var element = doc.getChild(j).copy();
var type = element.getType();
if (type == DocumentApp.ElementType.PARAGRAPH) {
body.appendParagraph(element);
} else if (type == DocumentApp.ElementType.TABLE) {
body.appendTable(element);
} else if (type == DocumentApp.ElementType.LIST_ITEM) {
body.appendListItem(element);
}
// ...add other conditions (headers, footers...
}
Logger.log(element.editAsText().getText());
elements.push(element); // store paragraphs in an array
Logger.log(element.editAsText().getText());
for (var el = 0; el < elements.length; el++) {
var paragraph = elements[el].copy();
var doc = DocumentApp.getActiveDocument();
var bodys = doc.getBody();
var cursor = doc.getCursor();
var element = cursor.getElement();
var container = element.getParent();
try {
var childIndex = body.getChildIndex(container);
bodys.insertParagraph(childIndex, paragraph);
} catch (e) {
DocumentApp.getUi().alert("There was a problem: " + e.message);
}
}
}

You want to copy the objects (paragraphs, tables and lists) from the document of 1MFG06knf__tcwHWdybaBk124Ia_Mb0gBE0Gk8e0URAM to the active Document.
You want to copy the objects to the cursor position on the active Document.
You want to achieve this using Google Apps Script.
If my understanding is correct, how about this answer? Please think of this as just one of several possible answers.
Modification points:
In your script, appendParagraph, appendTable and appendListItem are used at the 1st for loop. I think that the reason that the copied objects are put to the last of the document is due to this.
var body = docCopy.getBody(); can be put to the out of the for loop.
In your case, I think that when the 1st for loop is modified, 2nd for loop is not required.
When above points are reflected to your script, it becomes as follows.
Modified script:
function AddTable() {
var FileTemplateFileId = "1MFG06knf__tcwHWdybaBk124Ia_Mb0gBE0Gk8e0URAM";
var doc = DocumentApp.openById(FileTemplateFileId);
var docCopy = DocumentApp.getActiveDocument();
var body = docCopy.getBody();
var cursor = docCopy.getCursor();
var cursorPos = docCopy.getBody().getChildIndex(cursor.getElement());
var totalElements = doc.getNumChildren();
for (var j = 0; j < totalElements; ++j) {
var element = doc.getChild(j).copy();
var type = element.getType();
if (type == DocumentApp.ElementType.PARAGRAPH) {
body.insertParagraph(cursorPos + j, element);
} else if (type == DocumentApp.ElementType.TABLE) {
body.insertTable(cursorPos + j, element);
} else if (type == DocumentApp.ElementType.LIST_ITEM) {
body.insertListItem(cursorPos + j, element);
}
}
}
It seems that DocName is not used in your script.
References:
insertParagraph()
insertTable()
insertListItem()
If I misunderstood your question and this was not the result you want, I apologize. At that time, can you provide the sample source Document? By this, I would like to confirm it.

How can I script a Google Form from a Spreadsheet to go to a specific page based on an answer?

I have successfully created a Google form that populates from a spreadsheet using code adapted from here: https://www.youtube.com/watch?v=BYA4URuWw0s . Now I would like to make the form go to a specific question based on the answer of a previous question without losing the function of updating from the spreadsheet. I have tried to alter code from here: How to assign Go_To_Page in Form Service on Multiple Choice? , but have yet to have any luck. Below is what I have as of now. I am very new to coding and any help will be greatly appreciated. Thanks in advance!!!
//insert your form ID
var FORM_ID = '1iA8jX720Eqi_GKwiA1RJiWwzt3vJ8XOOAqh-SjO9mXM';
//insert your sheet name with a list
var EMP_SHEET_NAME = 'empROSTER';
//insert your range of lis
//insert list id (before run getItemsOfForm function and look at t as A1Notation
var range1 = 'B2:B';
//insert list id (before run getItemsOfForm function and look at log CTRL+Enter)
var ITEM_ID = '1097376824';
/*
add date question? -
form.addDateItem()
.setTitle('Date of Work Performed')
*/
//insert your sheet name with a list
var JOB_SHEET_NAME = 'jobROSTER';
//insert your range of list as A1Notation
var range2 = 'C2:C';
//insert list id (before run getItemsOfForm function and look at log CTRL+Enter)
var ITEM2_ID = '773657499';
//insert your sheet name with a list
var AT_SHEET_NAME = '300';
//insert your range of list as A1Notation
var range3 = 'B2:B';
//insert list id (before run getItemsOfForm function and look at log CTRL+Enter)
var ITEM3_ID = '1884670833';
//insert your sheet name with a list
var DT_SHEET_NAME = '1000';
//insert your range of list as A1Notation
var range4 = 'B2:B';
//insert list id (before run getItemsOfForm function and look at log CTRL+Enter)
var ITEM4_ID = '379969286';
//insert your sheet name with a list
var CT_SHEET_NAME = '2000';
//insert your range of list as A1Notation
var range5 = 'B2:B';
//insert list id (before run getItemsOfForm function and look at log CTRL+Enter)
var ITEM5_ID = '128282987';
//insert your sheet name with a list
var HOURS_SHEET_NAME = 'hourROSTER';
//insert your range of list as A1Notation
var range6 = 'B2:B';
//insert list id (before run getItemsOfForm function and look at log CTRL+Enter)
var ITEM6_ID = '1385334889';
//Section in question
function createGoTo(){
var af = FormApp.openById(FORM_ID);
var pAdmin = af.getItemById(AT_SHEET_NAME); //use findPageIds to get the page id of a pre-created page
var pDesign = af.getItemById(DT_SHEET_NAME);
var pCon = af.getItemById(CT_SHEET_NAME);
var item = ITEM2_ID
//create choices as an array
var choices = [];
choices.push(item.createChoice('Administration Job', pAdmin));
choices.push(item.createChoice('Design Job', pDesign));
choices.push(item.createChoice('Construction Job', pCon));
// assignes the choices for the question
item.setChoices(choices);
}
function findPageIds(){
var af = FormApp.getActiveForm();
var pages = af.getItems(FormApp.ItemType.PAGE_BREAK);
for (i in pages){
var pName = pages[i].getTitle();
var pId = pages[i].getId();
Logger.log(pName+":"+pId);
}
}
//End of section in question
function updateEmpName() {
var values_ = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(EMP_SHEET_NAME).getRange(range1).getValues();
values_[0][0] = values_[0][0].toString();
for(var i = 1; i < values_.length; i++){
// the if-block from https://productforums.google.com/d/msg/docs/v8ejYFpoGa8/HVqg6auIAg0J
if(values_[i][0] != "") {
values_[0].push(values_[i][0].toString())
}
}
var form = FormApp.openById(FORM_ID);
var list = form.getItemById(ITEM_ID);
list.asListItem().setChoiceValues(values_[0]);
}
function updateJobName() {
var values2_ = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(JOB_SHEET_NAME).getRange(range2).getValues();
values2_[0][0] = values2_[0][0].toString();
for(var i = 1; i < values2_.length; i++){
// the if-block from https://productforums.google.com/d/msg/docs/v8ejYFpoGa8/HVqg6auIAg0J
if(values2_[i][0] != "") {
values2_[0].push(values2_[i][0].toString())
}
}
var form = FormApp.openById(FORM_ID);
var list = form.getItemById(ITEM2_ID);
list.asListItem().setChoiceValues(values2_[0]);
}
function updateAdminTasks() {
var values3_ = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(AT_SHEET_NAME).getRange(range3).getValues();
values3_[0][0] = values3_[0][0].toString();
for(var i = 1; i < values3_.length; i++){
// the if-block from https://productforums.google.com/d/msg/docs/v8ejYFpoGa8/HVqg6auIAg0J
if(values3_[i][0] != "") {
values3_[0].push(values3_[i][0].toString())
}
}
var form = FormApp.openById(FORM_ID);
var list = form.getItemById(ITEM3_ID);
list.asListItem().setChoiceValues(values3_[0]);
}
function updateDesignTasks() {
var values4_ = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(DT_SHEET_NAME).getRange(range4).getValues();
values4_[0][0] = values4_[0][0].toString();
for(var i = 1; i < values4_.length; i++){
// the if-block from https://productforums.google.com/d/msg/docs/v8ejYFpoGa8/HVqg6auIAg0J
if(values4_[i][0] != "") {
values4_[0].push(values4_[i][0].toString())
}
}
var form = FormApp.openById(FORM_ID);
var list = form.getItemById(ITEM4_ID);
list.asListItem().setChoiceValues(values4_[0]);
}
function updateConstructionTasks() {
var values5_ = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(CT_SHEET_NAME).getRange(range5).getValues();
values5_[0][0] = values5_[0][0].toString();
for(var i = 1; i < values5_.length; i++){
// the if-block from https://productforums.google.com/d/msg/docs/v8ejYFpoGa8/HVqg6auIAg0J
if(values5_[i][0] != "") {
values5_[0].push(values5_[i][0].toString())
}
}
var form = FormApp.openById(FORM_ID);
var list = form.getItemById(ITEM5_ID);
list.asListItem().setChoiceValues(values5_[0]);
}
function updateHours() {
var values6_ = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(HOURS_SHEET_NAME).getRange(range6).getValues();
values6_[0][0] = values6_[0][0].toString();
for(var i = 1; i < values6_.length; i++){
// the if-block from https://productforums.google.com/d/msg/docs/v8ejYFpoGa8/HVqg6auIAg0J
if(values6_[i][0] != "") {
values6_[0].push(values6_[i][0].toString())
}
}
var form = FormApp.openById(FORM_ID);
var list = form.getItemById(ITEM6_ID);
list.asListItem().setChoiceValues(values6_[0]);
}
function getItemsOfForm(){
var form = FormApp.openById(FORM_ID);
var items = form.getItems(FormApp.ItemType.LIST);
for(var i in items){
Logger.log('id: ' + items[i].getId() + ' title: ' + items[i].getTitle());
}
}

PageBreakItem
A layout item that marks the start of a page. Items can be accessed or created from a Form.
PageNavigationType
An enum representing the supported types of page navigation. Page navigation types can be accessed from FormApp.PageNavigationType.
The page navigation occurs after the respondent completes a page that contains the option, and only if the respondent chose that option. If the respondent chose multiple options with page-navigation instructions on the same page, only the last navigation option has any effect. Page navigation also has no effect on the last page of a form.
Choices that use page navigation cannot be combined in the same item with choices that do not use page navigation.
// Create a form and add a new multiple-choice item and a page-break item.
var form = FormApp.create('Form Name');
var item = form.addMultipleChoiceItem();
var pageBreak = form.addPageBreakItem();
// Set some choices with go-to-page logic.
var rightChoice = item.createChoice('Vanilla', FormApp.PageNavigationType.SUBMIT);
var wrongChoice = item.createChoice('Chocolate', FormApp.PageNavigationType.RESTART);
// For GO_TO_PAGE, just pass in the page break item. For CONTINUE (normally the default), pass in
// CONTINUE explicitly because page navigation cannot be mixed with non-navigation choices.
var iffyChoice = item.createChoice('Peanut', pageBreak);
var otherChoice = item.createChoice('Strawberry', FormApp.PageNavigationType.CONTINUE);
item.setChoices([rightChoice, wrongChoice, iffyChoice, otherChoice]);
You can follow the sample create by Google and the implementation used in
Mogsdad's answert to further understand the flow.
I've added his code snippet:
function createForm() {
// Create a form and add a new multiple-choice item and a page-break item.
var form = FormApp.create('Form Name');
var item = form.addMultipleChoiceItem();
item.setTitle('Do you like Food')
var page2 = form.addPageBreakItem()
.setTitle('Page 2')
var item2 = form.addTextItem();
item2.setTitle('Why do you like food?')
var page3 = form.addPageBreakItem()
.setTitle('Page 3')
var item3 = form.addTextItem();
item3.setTitle("Why don't you like food?")
item.setTitle('Question')
.setChoices([
item.createChoice('Yes',page2),
item.createChoice('No',page3)
]);
}

Cached data:url image not being loaded onto page

I made this code to take images from the page, convert them into data:url (what was it again... base64 encoded string), and save into localStorage. Then when the page is reloaded it should load the images from the localstorage and set the now empty image placeholders with the data:url image.
Issue now is that the images do not load and if you check the dimensions for the data:url image it is 300x150 when it was originally 40x40.
Here's the code:
var isChached, // Checks is the page's images have been chached into localStorage
isChangesd; // Checks if any images have been deleted or added to the
var img = [], // Used for loading from saved. img[] holds data:url image versions of the...
src = [], // ...images in src[]
saved = [], // All images that are to be saved are placed here
add = [], // New images are placed here
rem = []; // Images to be removed are placed here
var cnv = document.createElement("canvas");
ctx = cnv.getContext("2d");
if (window.localStorage) {
// Base Object
function Saver (width,height,path) {
this.width = width;
this.height = height;
this.src = path;
}
// These fucnctions will help you save, load, and convert the images to data:url
function save (_str) { // Saves to localStorage. _str is the key to which to save to. _path is the value that you plan on saving
var str = _str;
str += ""; // This way even if I input a none string value it is still converted into string
localStorage.setItem(str,JSON.stringify(saved));
} // Checks if this image isn't in the saved cache
function singleLoad(a,b) {
}
function loader (_str) { // Loads images from localStorage. _str is the key to be loaded
var str = _str;
str += ""; // This way even if I input a none string value it is still converted into string
var val = JSON.parse(localStorage.getItem(str)); // Save the now loaded and parsed object str into val
console.log('val '+JSON.stringify(val));
val.splice(0,1);
console.log('val2 '+JSON.stringify(val));
for (var i in val) { // Take loaded information and place it into it's proper position
img[i] = new Image(val[i].width,val[i].height);
img[i].src = val[i].src;
setTimeout(function () {
var imgs = document.getElementsByTagName("img"); // Get all images
for (var k = 0; k < imgs.length; k++) {
if (imgs[i].id == i) { // If the id is equal to the index name of the src[]
imgs[k].src = val[i].src;
imgs[k].height = img[i].height;
imgs[k].width = img[i].width;
console.log("array: "+imgs[i]+". img[i]"+img[i]);
}
}
},2000);
}
}
function addToAdd(_id,_path) { // Places on-page images into src[]
var id = _id;
id += ""; // Makes sure that the id variable is a string
var path = _path;
path += ""; // Makes sure that the path variable is a string
add[id] = new Image();
add[id].src = path;
var imgs = document.getElementsByTagName("img");
console.log(imgs);
for (var i = 0; i < imgs.length; i++) { // adds width and height attributes
if (imgs[i].id == id) {
setDim(add[id],imgs[i].width,imgs[i].height); // Send info to setDim()
}
}
}
// Not using this
function apply() { // takes images from img after being loaded and adds them to the page.
var images = document.getElementsByTagName("img");
for (var i = 0; i < images.length; i++) { // Check through the page's images
for (var k in img) { // Check through the img[] where the loaded images are now saved
if (images[i].id = k) { // Check if the id of the image on the page is
images[i].width = img[k].width;
images[i].height = img[k].height;
images[i].src = img[k].src;
console.log("source: "+images[i].src);
console.log("images: "+images[i]+". saved images "+img[k]);
}
}
}
}
function setDim(obj,w,h) { // Sets the dimension(width = w; height = h;) for obj (image object)
obj.width = w;
obj.height = h;
}
function saveToSrc(_id,_path,w,h) { // Places on-page images into src[]
var id = _id,data;
id += ""; // Makes sure that the id variable is a string
var path = _path;
path += ""; // Makes sure that the path variable is a string
src[id] = new Image();
src[id].src = path;
console.log("src image " + src[id]);
var imgs = document.getElementsByTagName("img");
console.log("page images " + imgs);
for (var i = 0; i < imgs.length; i++) { // adds width and height attributes
if (imgs[i].id == id) {
setDim(src[id],imgs[i].width,imgs[i].height); // Send info to setDim()
src[id].addEventListener("load",function() { // We convert images to data:url
console.log("saved image " + src);
ctx.drawImage(src[id],0,0,w,h);
data = cnv.toDataURL();
console.log("saved src " + data +" src width and height: "+src[id].width+","+src[id].height);
saved[id] = new Saver(src[id].width + "px",src[id].height + "px",data);
console.log("saver array: "+saved[id]);
})
}
}
}
function loadToPage(a) {
var imgs = document.getElementsByTagName("img"); // Get all images. Use this to change image src and dimensions
for (var i in a) { // Go through the a[] and load all the images inside onto page
for (var k = 0; k < imgs.length; k++) {
if (imgs[k].id == i) {
imgs[k].src = a[i].src;
imgs[k].height = a[i].height;
imgs[k].width = a[i].width;
}
}
}
}
// Here you place ID and path/location values into the src[] using the saveToSrc(). You can place the parameters in with quotation marks or without quotation marks
// **N.B** the location link will have to be changed to it's absolute form so that even if a 'scraper' gets our webpage the links still come to us \o/
if (localStorage.getItem("cached") == null) { // Check if the "cached" key exists.
// If it doesn't exist...
isCached = false;
localStorage.setItem("cached","true");
} else {
// ...If it does exist
isCached = true;
}
if (!isCached) {
// Now you take images from server and load onto page. And then save them.
window.onload = function() {
saveToSrc("1","img/1.png",40,40);
saveToSrc("2","img/2.png",40,40);
saveToSrc("3","img/3.png",40,40);
saveToSrc("4","img/4.png",40,40);
console.log("src "+src);
console.log("saved array " + saved);
loadToPage(src);
setTimeout(function() {
save('saved');
},3000)
}
}
/* Will Be Added Later. Same time as local host */
else {
window.onload = function (){
setTimeout(function() {
loader("saved");
apply
},3000)
}
}
}
I'm quite new to javascript(started using javascript this June, or was it May. anyways...) so please relax on the terminology.
To recap: Images saving correctly(-ish), not loading, and wrong image sizes saved

Basicprimitives org chart node preview working wrong

I successfully create a organizational chart with BasicPrimitives-orgChart but I have a problem with the node's preview when you do mouse hover.
Sometimes randomly gray "preview" node appears on the left of the screen.
Sometimes the preview shows correctly
But somethimes appear the gray node
My fucntion to chart create
function buildChart() {
var options = new primitives.orgdiagram.Config();
var jsonString = $("[id$=txhDat]").val();
var datos = JSON.parse(jsonString);
var arrayItem = [];
for (index = 0; index < datos.length; index++) {
var objUbica = datos[index];
var item = new itemUbica(objUbica.cve, objUbica.name, objUbica.parent, objUbica.index);
var itemFinal = new primitives.orgdiagram.ItemConfig(item);
arrayItem[arrayItem.length] = itemFinal;
}
options.items = arrayItem;
options.cursorItem = 0;
options.templates = [getTemplateUbica()];
options.onItemRender = onTemplateRender;
options.hasButtons = primitives.common.Enabled.True;
options.hasSelectorCheckbox = primitives.common.Enabled.False;
options.onButtonClick = function (e, data) {
switch (data.name) {
case "move":
$("[id$=]")
dialogMoveOp(data.context.cveUbica, data.context.ubica);
break;
}
};
jQuery("#divChart").orgDiagram(options);
}
Also this happend just after the first render I dont manipulate anything in the DOM.

Write arrays content in my page using javascript

I'm studying javascript for the first time and I've some doubt: I have two arrays; the first one contain the image of a person, the second one his personal informations (the arrays' length is the same because they contain the same number of people). I'd like to write the content in my page so print the image and the infos of the first user, then the image and the infos of the second and so on...
How can I do it?
this is the code:
function jsonCard()
{
var richiestaCard = new XMLHttpRequest();
richiestaCard.onreadystatechange = function()
{
if(richiestaCard.readyState == 4)
{
var objectcardjson = {};
window.arrayCard= []; //creazione dell'array che conterrà le cards
objectcardjson = JSON.parse(richiestaCard.responseText);
arrayCard = objectcardjson.cards; //the first array
}
}
richiestaCard.open("GET", "longanocard.json", true);
richiestaCard.send(null);
}
function jsonEntity()
{
var richiestaEntity = new XMLHttpRequest();
richiestaEntity.onreadystatechange = function()
{
if(richiestaEntity.readyState == 4)
{
var objectentityjson = {};
window.arrayEntity= []; //creazione dell'array che conterrà le entity
objectentityjson = JSON.parse(richiestaEntity.responseText);
arrayEntity = objectentityjson.cards; //the second array
}
}
richiestaEntity.open("GET", "longano.json", true);
richiestaEntity.send(null);
}
function displayArrayCards()
{
jsonCard();
jsonEntity();
var inizioTag = "<img src=";
var fineTag = "\>";
for(i = 0; i < arrayCard.length; i++)
{
...
}
}
I'd like to have the image and then the infos (for the first user), the image and the infos for the second and so on all included in a div.

Try something along the lines of
function displayArrayCards()
{
jsonCard();
jsonEntity();
var wrapper = document.getElementById('div you want to put all of these users into');
for(i = 0; i < arrayCard.length; i++)
{
var userDiv = document.createElement('div');
var cardImg = document.createElement('img');
img.src = arrayCard[i];
/** Set other attributes for img **/
var entityDiv = document.createElement('div');
entityImg.innerHTML = arrayEntity[i];
/** Set other attributes for div **/
userDiv.appendChild(cardImg);
userDiv.appendChild(entityDiv);
wrapper.appendChild(userDiv);
}
}
Honestly there are a lot of ways to do this. Above is simply what I would do.