Let's say I have a quiz written in JavaScript. There are four different possible answers to each question. The participant clicks his way through the quiz one by one, he can cancel it at any time.
Now I want to save the user's click path including the respective timestamps. My idea is to record the click path as a JavaScript object and to transfer this object to the server via AJAX and save it in a JSON file after each click. Does that make sense?
The tricky things seem to me to be (1) to update the correct object (the correct line(s) in the JSON file) within a quiz session (no session cookies) for each click from the second click and (2) to append a new object for a new quiz session, both, if possible, without reading and rewriting the entire JSON file every time.
Your opinions and ideas are appreciated.
Edit: I have control over the backend and I'm using PHP.
Now I want to save the user's click path including the respective timestamps. My idea is to record the click path as a JavaScript object and to transfer this object to the server via AJAX and save it in a JSON file after each click.
Rather than sending the object to the server via Ajax and saving it in a .json file, you can, more simply, store a JSON (including timestamps) in localStorage and update it there.
See the localStorage API:
https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
localStorage is both:
more robust / persistent than keeping the data in an object
less elaborate than Ajax-ing data to the server repeatedly
Related
This may sound a little unprecise, but is it possible to change the TYPO3 session variable
$GLOBALS["TSFE"]->fe_user->setKey('ses', 't_minus', 0);
from javascript somehow for the variable to be processed within a listAction to specify certain records to be shown or not?
In more detail: I work on an extension for a calendar. The calendar is generated in javascript (that's the part i'm not responsible for). The listAction basically generates a JSON object or records which have a unix timestamp within a specific interval (2 weeks in the past, 3 weeks in the future). The javascript has a button "one week forward"/"one week back". One week back should subtract 604800 (1 week) from the session variable, one week forward add 604800 (1 week) to the session variable.
In the listAction the session variable adjusts the timestamp interval (n weeks forward/backward) or rather which records should be put into the JSON object.
Is it possible to access the session variable from javascript or does this violate safety requirements?
It is not possible to change TYPO3 session content directly via javascript. It may be that you can access the PHP session cookie via javascript - I am not quite sure on that -, but the session variables are stored in the TYPO3 DB. They are serialized and encrypted via PHP and you won't be able to get access on these via Javascript. This is only possible via PHP.
What you could do: create oneWeekForwardAction and oneWeekBackAction in your controller. Read your session cookie and modifie it to your needs. These actions can be activated via Ajax. For this to happen you have to create the appropriate links with the f:uri.action in advance in your Fluid template! Place these strings somewhere in your JSON object. Then you can connect these links to the click events.
Don't forget to generate a special AJAX page type with page.config.disableAllHeaderCode. If you search for this and Ajax you will find examples, f.e. this one:
[http://www.sklein-medien.de/tutorials/detail/erstellung-einer-typo3-extension-mit-ajax-aufruf/]
It is from 2016 und uses Extbase/Fluid.
I would create a PHP function to change this session variable (e.g. with eID functionality) and call the function via AJAX in JavaScript.
More see here: https://seethroughweb.com/ajax-with-typo3/
(Sorry, couldn't find a better manual in english, you need to use the new class names)
It's not a question of safety. The idea of a session is, to bind to the same data on the server over a series of multiple HTTP requests. Javascript lives in the Browser. There is no direct access from JavaScript to the data on the server.
If you are responsible for JS only, it's the job of the other person to provide an interface to the session data for you.
And yes, I think it a good idea to synchronise your calculations in the Browser with the data in the server else calendar datas get quickly out of sync. I would even go that far, that the server should be responsible for this kind of calculations, as it is more reliable than JS. So the guy responsible for PHP should do the main job and provide results to you i.e. via AJAX.
I have a function in javascript that is generating an array of canvas elements (screenshots of the current webpage). If the user clicked on a new link, I want to save my current array and somehow send it to the new page where I will call the function again, but with the array already filled by the previous values, through the same javascript file (I want it all to remain client side).
This was for context. So my question is, can I send data to pages sharing the same domain, client side? Is there some way I can store the information maybe, and then access it later, without going server side?
If you want to share these 'canvases' between tabs/websites then you should remember that inside localstorage or cookies you can only store STRINGS. You cannot store canvas as a string (you would get something like "[object HTMLCanvasElement]" which is nonsense in this case, but you can convert them to images and then convert images to strings, which you can then store inside localstorage or cookies.
I have webpage with table and javascript that sorts columns (js I found in google). This page have refresh option (every 30 secs). I need to save table sorting after refresh. How can i do it?
You must have some sort of a database.
A popular one is MySQL.
Remember, javascript is browser-side (client-side) language,
and so it is not capable of saving data. (without using HTML5 storage or cookie).
If you want to save it using cookie or html5 storage, look:
http://www.w3schools.com/html/html5_webstorage.asp
http://www.w3schools.com/js/js_cookies.asp
If you have access to PHP (at least you've tagged this with PHP) and you don't need to save the sorting permanently, try using sessions.
In essence:
Set table sorting with JavaScript on the page where the table is displayed (this is what you currently have).
Call PHP via AJAX, submit the selected sorting method/type as a parameter.
PHP script receives the POST and initiates or reloads a session (session_start()).
PHP saves the sorting method into the session $_SESSION['table_sort_method'] = $sort_method; ($sort_method should be received from the AJAX POST, 'table_sort_method' is just an example array key name).
Now when the page viewer returns to the table page, you can lookup the sorting method from $_SESSION and use it when the table is initially displayed.
Remember to call session_start() before any HTML is output to get access to the correct $_SESSION data.
If you need this to be permanent, you can use the above logic but replace the PHP session related parts with database interactions of your choice.
i have a code here but i don't know how to pass it to the other page... basically it is inside a function so before the code there is a function but i think there is no need to worry about that what i need is to change the "alert" so some kind of variable where i can grab the value and output it, and also i would like to ask because the data in that function is an array is it correct if i write it like this? var x=new Array($(this).attr('fill')); and if it is correct how will i grab the array data into the other page?
$('text').each(function(){
alert($(this).attr('fill'));
i have a working link here but in this one i still need to change the alert into a variable i can call
It's not entirely clear what you're asking, but to get data from one page to the next, you have the following options:
You can store the data on your server and each page can get the data from the server or have the server put the data into each page when the page is constructed.
You can write the data to HTML5 local storage in the browser and each page (on the same domain) can retrieve the data from HTML5 local storage.
You can write the data to a cookie in the browser and each page (on the same domain) can retrieve the data from the cookie.
You can pass data to the next page via the query string in the URL.
Javascript variables and properties of DOM objects live only for the duration of the current page. When you go to another page, the entire javascript state is thrown away and does not survive on the next page (it is built again from scratch on the next page). This is why you must store the data somewhere and then each page can retrieve the data.
I think in this case I need to write a client side script that onpageload/onchange gets options from server & builds a list dynamically. & stores new options to server via some JavaScript script. I will prefer to save user input in a file on server. I will be very thankful for any help.
Here is the stack we use for our web app and that works more or less the way you describe:
the user load an HTML page
the page make an ajax call and get the options as a JSON(either it exists already in the database, or a new option set is generated)
the json is rendered using a JS templating engine (PURE in our case)
the user change something
the same JSON is modified and sent by a POST to the server
the server read that JSON and store it in the database(you would write the data to your file). And then go back to the step 4, to wait for another user change.