alter information in a javascript document

Hey there, I've got a JavaScript array of URLs in my content.js file. I want to show these URLs in separate input boxes on a different page called display.php. Each input box will have edit and delete buttons. Any changes made by the user should update the content.js file.

I've successfully displayed all the URLs in the input boxes. Now, when a button is clicked, it triggers a function.

My query is, what would be the most efficient way to update the array in the content.js file? The file only contains one array. I'm currently exploring file handling but that means the content.js must always adhere to a strict format. Is there a more effective method to modify the array contents or delete rows without using file handling?

javascriptarrays

Answer №1

Step one involves reading the JS file contents and passing it to the json_decode function to create a PHP array. This array is then used to generate text boxes for the user.

For the next step, gather the strings submitted by the user (e.g. from $_POST) and use them to create a PHP array. Convert this array into a JavaScript array in string format using the json_encode function. Finally, write this string back to the JS file to ensure its content remains valid at all times.

Answer №2

To achieve this task, one can utilize a server-side language such as PHP. Check out this informative tutorial for guidance on writing files using PHP. One effective approach is converting the array into a string with json_encode, and then utilizing json_decode to revert it back to an array after reading it.

If these URLs are intended solely for the user's personal use and do not need to be shared with others, consider implementing HTML5 localStorage.

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

Guide to authenticating with npm using various user accounts for different scopes within the same registry

I am facing an issue with setting up multiple npm authTokens for two different scopes on the same registry. @scope1:registry=https://registry.npmjs.org/ @scope2:registry=https://registry.npmjs.org/ //registry.npmjs.org/:_authToken=${NPM_TOKEN} I have atte ...

javascriptnode.jsnpmnpm-install.npmrc

Perform time update every second

Is it feasible to have my timeupdate function run every second? (Using VUE CLI) @timeupdate="videoSecond" videoSecond(){ let Second = this.player.currentTime(); let CaptureList = this.capturesList; CaptureList.forEach(element => ...

javascripthtmlvue.js

Tips for creating a static background when displaying a modal popup in AngularJS

Incorporating a modal popup to modify a row within a grid view has been my recent task. Leveraging the row.getProperty() function, I successfully extracted the row values within the modal. However, an inconvenience emerged when attempting to edit a value ...

javascriptangularjstwitter-bootstrap

How can I effectively address issues with jqGrid's sorting and paging functionality?

After making changes to the server-side code, it now looks like this: int nm = objects.ToList().Count; if (objects.ToList().Count > 0) return new PagedList(objects, nm, 1, 25, null); else return null; The JSON data has been updated as follows ...

c#javascriptjqueryasp.netjqgrid

Execute asynchronous JavaScript request

When a user types something into the input id=2, an ajax function triggers. Here is the HTML: <input id="2" type="text" onkeyup="posttitulo(this.value)" /> And here is the SCRIPT: function posttitulo(value){ $.post("getdata/posttitulo.php",{p ...

javascriptajax

Strategies for effectively handling errors in the requestAnimationFrame function

I'm currently facing issues with the animate() function, as it tends to crash my browser and cause my computer to heat up when errors occur. I attempted to use a try/catch handler to handle these errors but it did not work as expected. animate(){ ...

javascripterror-handlingthree.jsgsaprequestanimationframe

Ways to transform epoch timestamp to present timestamp?

Is there a way to accurately convert an epoch timestamp in milliseconds to the current timestamp in milliseconds? My Attempt: var currentTime = (resp.timestamp * 1000) + 1980000000; resp.timestamp represents the epoch timestamp I attempted to add 5 ho ...

javascriptjquery

The ng-repeat track by function is not functioning as expected, displaying slow performance and continuing to create $$hashKey

In my code, I have an ng-repeat setup like this: ng-repeat="article in main[main.mode].primary | orderBy: main[main.mode].primary.filter.order track by article.url" The main[main.mode].primary array contains the data and the .filter.order string is used ...

javascriptangularjsangularjs-ng-repeatangularjs-track-by

Rendering real-time data using jQuery's Ajax functionality

Imagine having a webpage that gradually returns a large amount of data over time. Here's an example code snippet to illustrate this: <?php $iTime = time(); while(time()-$iTime < 10 ) { echo "Hello world"; echo str_repeat( ' &apos ...

javascriptajax

Step-by-step guide to implementing a datepicker textfield with Vuetify 3

I'm currently exploring Vuetify 3 and aiming to implement a textfield that serves as a datepicker. For reference, you can find a similar example in the Vuetify 2 documentation here. Unfortunately, the Vuetify 3 docs do not yet include an example like ...

javascriptvue.jsvuetify.jsvuetifyjs3

Is it possible to transform an array into a JSON file and securely store/upload it in an AWS S3 bucket?

Recently, I started exploring aws and its capabilities. Currently, my focus is on developing a web application that allows users to input text in two separate fields. Subsequently, this text will be converted into a Json file and stored in the S3 bucket. ...

javascriptangularjsjsonamazon-web-servicesamazon-s3

Can you explain NodeSource in simple terms, and what purpose does it serve?

Not too long ago, I delved into researching how to effectively host a MEAN stack web application on AWS. During my quest for knowledge, I stumbled upon a tutorial that caught my eye. The one I ended up following can be found at https://www.youtube.com/wat ...

javascriptnode.jsamazon-web-services

Integrating a YouTube video in the Google Maps info window with the help of Ajax technology

Currently working on a project for Udacity, my goal is to develop a neighborhood map using Google Maps API alongside Knockout and Ajax to integrate with another 3rd party API. A unique aspect of my approach is focusing on bars in the neighborhood and utili ...

javascriptjqueryajaxgoogle-mapsyoutube

Troubleshooting issues with AngularJS's minDate functionality

I have been trying to set the minDate for the datepicker to today, following the example on the angularJS bootstrap site. However, it seems like something is not working correctly. There are no console errors showing up, but it appears that the minDate is ...

javascriptangularjstwitter-bootstrap

Using Angular's ng-switch directive within a select dropdown option

Can we implement the [Data Presentation Format] to be utilized in the [Dropdown Box]? Specifically, I would like the "parent" items to appear as is within the dropdown, while the "child" items should have a [tab] indentation to denote their relationship wi ...

javascriptangularjsng-switch

Tracking tool for monitoring progress of HTTP POST requests

Hi, I am still a beginner when it comes to NodeJS and its modules. I could really use some assistance with creating a progress bar for an application I'm working on. Right now, the progress bar only reaches 100% upon completion and I suspect my piping ...

javascriptnode.jsajaxsocket.iorequest

Sluggish animation performance in threejs when using requestAnimationFrame within a class

Experiencing choppy animation on the JSFiddle? When trying to move your mouse or interact with the content, you may have come across issues with the classing related to requestAnimationFrame(this.animation). Initially, it didn't work as expected, but ...

javascriptclassthree.jsthisrequestanimationframe

Implementing a redirect following the notification

I'm facing an issue with a function that sends form data to Google Sheets. How can I make the redirect button work after displaying an alert message? I attempted using window.location.href='', but it redirects without submitting the data. & ...

javascripthtmljquery

Printing the selected value from a drop-down box in HTML with JavaScript

I'm in the process of creating a web page structured like this: <html> <head> <title>Bug UI</title> </head> <body> <script> function myfunc() { //what should I include here?? } </script> <form> ...

javascripthtml

In JavaScript, the price can be calculated and displayed instantly when a number is entered into a form using the input type 'number'

Is there a way for me to automatically calculate the price and display it as soon as I enter a number into my form? Currently, the price is only displayed after I press submit. <script type="text/javascript"> function calculatePrice() { ...

javascriptphpjqueryfunction