The ng-click event for the reset button is limited to a single use

There seems to be a problem with the reset button functionality on my webpage. Although it initially works, it only works once and then requires a reload of the page to function again.

Here is the JS code:

var ctrl = this;
var original_device = angular.copy(device.data);
ctrl.device = device.data;

ctrl.reset = function () {
    ctrl.device = original_device;
};

And here is the snippet from the HTML file:

<button ng-click="ctrl.reset()">Reset</button>

Answer №1

To maintain a consistent object, it is necessary to duplicate the item as using it will merge the device and copy into one unified entity.

ctrl.reset = function () {
     ctrl.device = angular.copy(original_device);
};

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

jQuery shorthand conditional statements

I currently have a jQuery function that is triggered by two separate buttons. $("#btnSearch, #btnDirectorSearch").click(function () { The construction of the HTML output within this function relies on which button was clicked. To accomplish this, I am ut ...

Add a CSS file to the browser-sync with proxy functionality

Currently, I have a script that I utilize to proxy a live website in order to make CSS modifications. Instead of replacing the online CSS file with a local one using a rewrite, I am exploring the possibility of injecting an entirely new file below the exis ...

Using the setInterval function in conjunction with the remoteCommand to create a

I am attempting to create a remote command that calls a bean function and updates a progress bar every 2 seconds until cancelled. The remote command looks like this: <p:remoteCommand id="usedCall" name="queryUsed" onco ...

Is it acceptable to post variables using AJAX for processing?

Is there a way to send data with AJAX using the code provided? It seems like the information is not being sent to the PHP file as intended. Here is the code snippet: $('#send').click(function(){ var pseudo = $('#psd').val(); }) ...

Click the button to increase the counter up to 2, and then decrease it back to 0 starting from 2

I'm struggling to implement this efficiently. My count keeps incrementing and decrementing by 1, causing me to get stuck at the value of 1 without going back down to zero. using react: jsfiddle The counter increases from 0 to 2 when onClick() is tri ...

NodeJS Integration Issue with AngularJS Implementation

I am a beginner in the world of MEAN Stack development. Recently, I tried creating a simple HTML page with some AngularJS code that works perfectly when opened directly in my browser. However, when I attempt to render it using my Node.js server, the Angula ...

Using the onClick function to set attributes in React JS

I am currently working with 2 functions: addBookmark() and removeBookmark(). There is a variable called IsBookmarked that can be either true or false. In my JSX code related to bookmarks, it looks like this: {props.singleCompany.IsBookmarked ? ( ...

JQuery/JS function not functioning as expected

Creating HTML with jQuery to retrieve data from a web API. At the start of my script, I defined a function that checks the selected value of a dropdown and assigns it to a global variable. var $seldom; $(document).ready(function () { function chkdom() ...

What strategy should be employed to ensure that Javascript is operational upon completion of page loading?

I'm facing a challenge with running my JavaScript on my ASP.NET webform page. It seems like the elements are not fully loaded when the script runs, which could be causing issues. How can I use jQuery to ensure that my script is placed at the bottom of ...

Starting object arrays in Angular 6 using ES6

As someone who is just starting out with javascript, I have encountered a challenge with a nested class structure. Specifically, I am looking to initialize an array of EventDate objects and assign it to 'this.dates' within the CustomerEvents cons ...

Utilizing React hooks to capture the checkbox value upon change and transfer it to the submitForm function

I've got a functioning hook that monitors the onChange event of input fields, then spreads them into a variable and sends them to a Lambda function for sending an email with SendGrid. Everything is working fine. However, when I add an input type of c ...

jquery token selection dropdown box

I am not encountering any errors with this particular issue, however upon reviewing the plugin it appears that it should only toggle "admin admin" in the dropdown list. I am currently utilizing the most recent version of jquery. Upon further investigation ...

I'm having trouble locating the corresponding end tag for "<%". How can I resolve this issue?

Here lies the issue: <% for(let i = 0; i < <%= elements %>.length; i++){ %> <li><%= elements[i] %></li> <%}%> ...

Converting an rrule date value from an array to a customized string format

Here is an array that I am working with: [{ evening_feeding: false evening_feeding_time: "19:00" feeding_frequency_rule: **"FREQ=DAILY;INTERVAL=2"** id: 890 morning_feeding: true morning_feeding_time: "04:00 ...

Is it possible to stop Angular requests from being made within dynamic innerhtml?

I have a particular element in my code that looks like this: <div [innerHtml]="htmlContent | sanitiseHtml"></div> The sanitiseHtml pipe is used to sanitize the HTML content. Unfortunately, when the htmlContent includes relative images, these ...

Enable automatic playback of HTML5 video with the sound on

I want to add an autoplay video with sound on my website, but I'm running into issues with newer browsers like Chrome, Mozilla, and Safari blocking autoplay if the video doesn't have a 'muted' attribute. Is there a clever HTML or Javas ...

Setting up VideoJS Flash backup

Due to Firefox's restriction on using an .mp4 file in the <video> tag, I am required to utilize the Flash fallback option on my VideoJS player. When it comes to Chrome, Safari, and IE, I can customize my VideoJS player via JavaScript to perform ...

Contrasting methods of adding a value to an array state in React

Can you advise me on the most effective method for inserting a value into an array, as well as explain the distinctions between these two code examples? setOtoValue((current) => [ ...current, Buffer.from(arraybuf, 'binary').toString(' ...

Exploring the globe with 3D raycasting, orbit controls, and dynamic camera rotation

It would be great if users could hover over the small spheres in different countries to get more information. Initially, I thought using a raycaster would help achieve this, but it's not responding to mouse movements as expected. It seems like the is ...

What is the process for converting strings or text to EBCDIC using JavaScript?

In the midst of developing a website, I am working on a feature that allows users to input a minimum of 256 characters/strings (with code verification), choose between ASCII or EBCDIC conversion, and view the converted text string displayed on the page bas ...