Combining different javascript objects rendered by multiple components - javascript

I have a component which writes/generates javascript from a server side renderer. This component can be used in multiple times in a same page. However, once the page is loaded I have to collect all the variables or JSO written by this multiple components in the page. How can I do this so that I will have a collection of all the variables or JSO?
For e.g. If this component (lets say ) is used twice in the page then it emits two javascript block on client/browser -
var arr1 = new Array['First', 'Second'] and
var arr2 = new Array['Third', 'Fourth'].
In order to make a final rendering I have to combine these two arrays.

You will need to be a little more specific about your problem, maybe with an example page but here are some thoughts.
If you have a server-side component that writes JavaScript during page generation, I would generate a function call each time, something like:
Component_appendArray(['First', 'Second']);
...
Component_appendArray(['Third', 'Fourth']);
then ensure that you have your function Component_appendArray() defined before these calls:
var globalArray = [];
function Component_appendArray(array)
{
globalArray = globalArray.concat(array);
}
At the end, globalArray should contain:
['First', 'Second', 'Third', 'Fourth']
Hope this helps.

Although I do not understand the entire scenario, let me suggest that if you are printing out variables throughout the HTML in order to use them after the page loads, that you instead use hidden input fields. I see this often, where variables are used to pass values to a function or a script at the bottom of the page, but using the values of hidden input fields allows you to get all your scripts out of the content areas. It makes for a cleaner solution.

Related

How to create multiple random Google forms with a fixed number of Multiple Choice Questions with a single script

Disclaimer: I just started with JavaScripts/GoogleForms
I want to validate some data with a GoogleForm that I've created. Each section contains 5 multiple choice questions. In the example below I've shown how I add one question to the section.
// Sentence 1
sentence = form.addMultipleChoiceItem();
choices = [
sentence.createChoice('Answer I'),
sentence.createChoice('Answer II'),
sentence.createChoice('Answer III'),
]
sentence.setTitle(pred_1) // pred_1 -> Variable extracted from the dataset
.setChoices(choices);
In the end, I can build an excellent-looking form that contains 20 sections with five questions each based one a single dataset in my Google Drive Folder.
However, I want to extend this. I have ten different datasets that I want to have evaluated. A straightforward approach is copying the script ten times and pointing the script towards a different dataset. However, with this approach, I have to run the script ten times, and every time I adjust something (e.g. in the Title/HelpText), I have to rerun all the scripts.
I was thinking there should be a solution where I just read all the file inside my Drive folder and run my main scripts that produces the forms for multiple dataset. I was thinking something like this:
function createForms() {
// Folder with data
var folder = DriveApp.getFolderById('FOLDERID')
// List files
var files = folder.getFiles()
for (var i = 1; i < 11; i++) {
createMultipleChoiceForm(files[i]) // Function that creates a single form
}
}
This does unfortunately does not work at all (it does not give any errors, but does not produce anything).
EDIT:
This does actually work, but it creates a new form every time without saving it (it overruns the previous version).
I final approach is of course concatenating all the 10 datasets, and sample them from within the Google Script editor. But I still want to end up with ten different form (so I can send them to different people.
I hope anyone can give me some pointers in the right direction.
Thanks!
The Folder.getFiles() method returns a FileIterator object rather than an array. The code in the question ends up calling createMultipleChoiceForm() with an undefined parameter every time.
To make it work, replace the for loop with this pattern:
const files = folder.getFiles();
while (files.hasNext()) {
createMultipleChoiceForm(files.next());
}

Merging arrays defined on different pages using concat

I have two arrays I want to merge them into one.
let signUps = [];
let usersInputs = [];
but each of them has been defined on different pages and therefore when I try
function mergeArray (){
var merged = signUps.concat(usersInputs);
document.getElementById('btn').innerHTML = merged
console.warn('added' , [merged] );
}
It says, on this occasion, usersInputs is not defined.
I have encountered this problem on so many occasion, maybe my lack of understanding. so how one approaches this problem?
On different pages you mean it's completely on a separate HTML document and you want to merge them together? In a web page whatever JavaScript you execute is available only inside of that webpage, not on a separate one.
You may either want to store your data on server, or pass it using form data, or best make use of localStorage or sessionStorage API in JavaScript to pass data from one page to another in a simple way.

Update a javascript script on-the-fly

Let's say I have a script that runs a for loop that outputs x number of new script lines depending on what a user answers. This script's main purpose is to construct an outgoing SOAP message with defined parameters. The for loop creates additional parameters to add to the existing parameters that are hardcoded into the script. How do I add these new parameters from the for loop to the script? Basically, add lines of script within the script (print to the script)... I can include the script if need be.
Thanks!
You can use arrays with array.push(element) to make this happen. Arrays are incredibly powerful for processing like what you're describing, and we use them in our app for this purpose.
var scripts = [];
for(var i=0; i < data; i++) {
scripts.push(data[i]);
}
Then if you need a single string at the end you can use join like this scripts.join(). Note that you could also add line returns if you want too.
However, it sounds like you do want to process the results of the scripts in order, at which time you can just loop through that array and send the parameters to another function one at a time.
There are a lot of functions in the array object that will help with what you're trying to do. Here is a link to the MDN docs for your reference.

Preventing a section of html from referring to other tags / elements on the same page

I have a php webpage that includes some graphical dials created with css and javascript (and an ajax call). Each dial is added to the webpage using:
$_SESSION['info'] = dial1 Specific info.
include 'dial.php';
$_SESSION['info'] = dial2 Specific info.
include 'dial.php';
Inside dial.php, there is a section that analyzes the SESSION variable to adjust an arm on the dial, and creates the dials circular shape with css. The problem I'm trying to solve is the second dial is a copy of the first dial, and not distinct.
How can I make the above code force each "include 'dial.php'" to operate independently from each other and not interact with each other (since the variables, function names, and css names are the same for each dial).
Best Regards
you can not add two different object into one variable !
make your session variable as an array like below :
$_SESSION['info'][1] = dial1 Specific info.
include 'dial.php';
$_SESSION['info'][2] = dial2 Specific info.
include 'dial.php';
for a better answer , put your dial.php code , I'll update my answer
The session variable can hold many types of data but you need to structure the session variable in a different manner to your initial code. If you were to assign an object as the value ( as below ) you can access the right piece of information easily using the object notation shown below.
$_SESSION['info']=(object)array(
'dial_1' => 'dial1 Specific info',
'dial_2' => 'dial2 Specific info'
);
then access the individual info by
$info=$_SESSION['info']->dial_1;
So I ended up using dynamic html tag ids, function names, and variables. It seems to be working out fine.

pass multidimensional javascript array to another page

I have a multidimensional array that is something like this
[0]string
[1]-->[0]string,[1]string,[2]string
[2]string
[3]string
[4]-->[0]string,[1]string,[2]string[3]string,[4]string,[5]INFO
(I hope that makes sense)
where [1] and [4] are themselves arrays which I could access INFO like myArray[4][5].
The length of the nested arrays ([1] and [4]) can varry.
I use this method to store, calculate, and distribute data across a pretty complicated form.
Not all the data thats storred in the array makes it to an input field so its not all sent to the next page when the form's post method is called.
I would like to access the array the same way on the next page as I do on the first.
Thoughts:
Method 1:
I figure I could load all the data into hidden fields, post everything, then get those values on the second page and load themm all back into an array but that would require over a hundred hidden fields.
Method 2:
I suppose I could also use .join() to concatenate the whole array into one string, load that into one input, post it , and use .split(",") to break it back up. But If I do that im not sure how to handel the multidimensional asspect of it so that I still would be able to access INFO like myArray[4][5] on page 2.
I will be accessing the arrary with Javascript, the values that DO make it to inputs on page 1 will be accessed using php on page 2.
My question is is there a better way to acomplish what I need or how can I set up the Method 2 metioned above?
This solved my problem:
var str = JSON.stringify(fullInfoArray);
sessionStorage.fullInfoArray = str;
var newArr = JSON.parse(sessionStorage.fullInfoArray);
alert(newArr[0][2][1]);
If possible, you can use sessionStorage to store the string representation of your objects using JSON.stringify():
// store value
sessionStorage.setItem('myvalue', JSON.stringify(myObject));
// retrieve value
var myObject = JSON.parse(sessionStorage.getItem('myvalue'));
Note that sessionStorage has an upper limit to how much can be stored; I believe it's about 2.5MB, so you shouldn't hit it easily.
Keep the data in your PHP Session and whenever you submit forms update the data in session.
Every page you generate can be generated using this data.
OR
If uou are using a modern browser, make use of HTML5 localStorage.
OR
You can do continue with what you are doing :)

Categories

Resources