title: Edit functionality using javascript and local storage
body: <p>Below is my code for dynamic generation of rows:</p>
  
  <pre><code>function addRow() {
  
          var myName = document.getElementById("name");
          var type = document.getElementById("type");
  
  
          var table = document.getElementById("myTableData");
  
          var rowCount = table.rows.length;
          var row = table.insertRow(rowCount);
  
  
          row.insertCell(0).innerHTML=myName.value; 
          row.insertCell(1).innerHTML=type.value; 
  
          row.insertCell(2).innerHTML= '&lt;input type="button" value = "Delete" onClick="Javascript:deleteRow(this)"&gt;';
          row.insertCell(3).innerHTML=  '  &lt;a href="#login_form" id="login_pop" onclick="Edit();"&gt;Edit&lt;/a&gt;';
  
  
      }
  </code></pre>
  
  <p>and below is my code for popup after clicking on edit link:</p>
  
  <pre><code>&lt;a href="#x" class="overlay" id="login_form"&gt;&lt;/a&gt;
          &lt;div class="popup"&gt;
  
              &lt;p&gt;Please edit your details here&lt;/p&gt;
  
              &lt;div&gt;
                  &lt;label for="firstname" id="attr_Name"&gt;Attribute Name&lt;/label&gt;
                  &lt;input type="text" id="firstname" value="" /&gt;
              &lt;/div&gt;
              &lt;div&gt;
                  &lt;label for="lastname" id="attr_Type"&gt;Attribute Type&lt;/label&gt;
  
                  &lt;select  id="type1" &gt;&lt;option &gt;Text&lt;/option&gt;&lt;option &gt;Paragraph&lt;/option&gt;&lt;option &gt;Dropdown&lt;/option&gt;&lt;/select&gt;
              &lt;/div&gt;
              &lt;input type="button" id="button1" value="Save" onclick="saveEditedValues()"/&gt;
  
  
              &lt;a class="close" href="#close"&gt;&lt;/a&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Now I am using local storage to save my edited values but I am not getting how to reflect it in the dynamically generated rows. Below is code for Local storage:</p>
  
  <pre><code>function saveEditedValues(){
          var myName = document.getElementById("firstname").value;
           alert(myName);
          var type = document.getElementById("type1").value;
          alert(type);
      localStorage.setItem("attributeName",myName.value);
      localStorage.setItem("attributeType",type.value);
      var namevar1=localStorage.getItem("attributeName");
      var namevar2=localStorage.getItem("attributeType");
  
  
      }
  </code></pre>
  
  <p>Please provide some help</p>