Create a button which duplicate elements of an array

Question

Hello everybody I'm new in javascript. I want to create a button which duplicate elements in an array. I try this :

   %a.btn.btn-success#addd{ :href => "#", :onclick => "duplicate(this.parentNode.parentNode)" }

       :javascript
       document.getElementById('addd').click = duplicate;

       var i = 0;
       var original = document.getElementById('inf_finding.id');

       function duplicate(original) {
         var clone = original.cloneNode(true);
         clone.id = "inf_finding.id" + ++i;
         original.parentNode.appendChild(clone);
       }

But I refresh it, the element that I add is not in the page anymore.Can you help me to resolve this please ? Here are the screenshots :

First

It add properly the element

But when I refresh the page, the element disappears.

Of course, when you reload the page, everything is reset. What did you expect :) You have to implement some kind of persistence, the easiest being probably the LocalStorage that can store strings and is unaffected by page refreshes. — Jeremy Thille
– Jeremy Thille, Commented Aug 8, 2018 at 12:59

Xander · Accepted Answer · 2018-08-08 13:01:09Z

1

Your code only makes changes within the DOM of the current webpage. When the page is refreshed, the DOM is regenerated from the HTML sent by the server and so your changes are lost.

In order to make persistent changes, you need to save data either on the server (using AJAX) or in the browser using Local Storage, Cookies, etc.

answered Aug 8, 2018 at 13:01

Xander

1,74615 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Create a button which duplicate elements of an array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related