Record the occurrence of keyboard events along with their timings into a spreadsheet

For my college dissertation, I am conducting a usability test on various number entry keyboard interfaces. To accurately measure the effectiveness of these interfaces, I need to capture every key press made by participants along with the timing of each press. Simply recording form submissions will not provide the level of detail I require, as I also want to track errors and corrections made during the process. Ideally, I would like to store this data in a .csv or spreadsheet format for further analysis once the experiments are complete.

While my supervisor suggested building a webpage and using javascript for this task, I must admit that I am a novice in this area, having only basic knowledge of HTML. If anyone could offer assistance or direct me to resources where I could learn more about this topic, I would greatly appreciate it. Despite spending hours searching online, I have had little success in finding a solution. Essentially, I aim to achieve something similar to the example shown in this link http://javascript.info/tutorial/keyboard-events#test-stand-test-stand, but with the added functionality of storing data in an external file on my computer, including timings of key presses.

Thank you in advance,

A determined student.

Answer №1

One cannot directly write JavaScript to a file. Instead, the data can be sent to the server for saving in a .csv format at a specified location. Another option is to format the data so that it can be easily copied into Excel.

A recommended approach would be to set up a Node.js server and utilize jQuery+AJAX to send the data to the server through a POST request, followed by saving a .csv file on the server.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to transfer a JSON object from an Express server to a Next.js page?

I am currently new to using Next.js and Express. My goal is to send post data from the server to the client, which in this case is my web browser. I have successfully received the data on the server, and now I need to send it to the corresponding page. Bel ...

The server returned a response that was void of any content

I have encountered an issue while trying to retrieve data from my server. The request works perfectly fine when tested with Postman, returning the expected data. However, upon implementing the request in my application, I receive an empty object with prope ...

Using Regular Expressions in JavaScript to verify if an element from an array is contained within a string

Looking for a simple JavaScript code for a Vue application that will split the string into an array and check if any value is present in a different string. Here's what I have: let AffiliationString = " This person goes to Stony Brook" ...

Dynamic text modification through background color adjustments with Javascript

I have created a JavaScript function that changes the background color of a website, but I am wondering if there is a way to also change the text in the body of the page when this color change occurs. function updateContent(element, curColorNumber){ ...

JavaScript: Remove duplicate values from one array by comparing and utilizing a search filter against another array

There are two arrays available: public favoriteTeams: any[] = [ { name: 'Team Batman' }, { name: 'Team Superman' }, { name: 'Team Darkseid' }, { name: 'Team Wonder Woman' } ]; public searchTeams: any[] = [ ...

Acquire a structured list of the focus order within the DOM elements

It intrigues me how the DOM is constantly changing. I'm curious if there's an easy way to retrieve a sorted list of focusable elements within the DOM at any moment. This would encompass nodes with a specified tabindex value that isn't -1, as ...

Having trouble loading a chart with amcharts after sending an ajax request

I have integrated amcharts to create a pie chart. When I click a button, an AJAX request is triggered to fetch data from MySQL in JSON format. After receiving the JSON array, I pass the data to amcharts but the chart doesn't display. Oddly, if I redi ...

Issues with connecting local CSS and JS files to HTML pages

I am facing an issue with my base HTML file that I want all other pages to inherit certain characteristics from. The problem arises when I try to link an external CSS file like bootstrap.css from within my project directory. I have the file stored in the s ...

Errors and warnings caught off guard while running json-server with the --watch flag

I'm having some trouble using json-server in the following way: $ json-server --watch db.json Every time I try to run that command, I encounter errors or warnings depending on the version of json-server that is installed: 1.0.0-alpha.1-1.0.0-alpha.1 ...

Is there a way to expand my dialog box to fill the entire screen?

Currently, I am studying a tutorial on creating an angular lightbox, which can be found here. However, I am facing an issue where the lightbox only expands to the size of the div when I place the button inside it. The code snippet in question is as follows ...

The insert event is not being triggered by Mongoose's watch() function

Currently, the version of MongoDB being used is 4.4.6 and I am facing an issue where the Data.watch() method does not trigger as expected. After thorough testing, I have confirmed that the changeStream and connection are set up correctly without any proble ...

Advancing progress bar through interactive engagement

Currently, I am delving deep into the world of html and experimenting with progress bars by watching numerous tutorials. I successfully created a progress bar that loads from 0 to 100 using JavaScript. However, I now have a new challenge. On my page, I pro ...

Turn off the highlighting for an external event in FullCalendar

Hey there, I'm currently working with the fullcalendar jquery plugin v2.6.1 and I have a question about preventing external events from being highlighted while they are being dragged onto the calendar. Is there a way to stop the fc-highlight from app ...

Creating a line graph with d3.js

I am currently working on implementing a line chart using data in JSON format following the steps outlined in this tutorial: [{"Machine":"S2","Data":[{"Percentage":0,"Week":33,"Year":2014,"Monday":"11/08/14","Items":0},{"Percentage":0,"Week":34,"Year":201 ...

Is there a way to incorporate content onto a webpage solely through the use of CSS and JavaScript?

Currently, I am in the process of developing a real estate website that utilizes a paid service for displaying real estate listings. The unique aspect of this setup is that my website operates as a subdomain of the main listings website, resulting in a URL ...

Sending a JSON object back to HTML

In the process of developing a web app, I encountered a need to update the configuration of a specific graph type. My current approach involves utilizing Python3 with Flask and HTML. My objective is to achieve dynamic configuration updates without relying ...

Learn the proper way to refresh a post by using the F5 key in order to show a new get

Let me describe the issue I'm facing today. Currently, I am posting a message in my database and then performing a GET request in the same component to display the data sent just before. The problem is that every time I have to manually refresh the ...

How can one effectively handle elements or objects that are both event listeners and event triggers?

Yesterday, I posted a similar question but found it too complex and vague after further research, so I removed it. I have now created a new demo here, which should be self-explanatory for the most part. Below are the HTML and JavaScript sections: <sel ...

Retrieving input field value in HTML through a button press

Feeling stuck trying to incorporate an input field value into an ajax call? Here's the code I have so far for a button and input field combination, but I can't seem to get it working. function submit() { $.ajax({ type: 'POST&apo ...

Is there a way I can set a variable as global in a jade template?

I am trying to pass a global object to a jade template so that I can use it for various purposes later on. For instance: app.get("/", function(req, res){ var options = { myGlobal : {// This is the object I want to be global "prop ...