2017-12-08 10 views
0

안녕 얘들 아, 내가 codeigniter 프로젝트에서 일하고 내 양식의 ane에 localstorage 선택한 값을 저장하고 페이지로드 후 표시하는 데 사용하고 있습니다. 하지만 어떻게 든 내 모든 분야에서 작동하지 않습니다. 때로는 첫 번째 값이 작동하는 경우가 있습니다. 마지막 값이 작동하는 경우가 있습니다. 총 4 개의 필드가 있으며 모든 값은 localstorage에 저장되어야합니다.localStorage가 html5의 모든 필드에서 작동하지 않습니까?

html로 부분 :

<div class="control-group"> 
      <label class="control-label">Select Month</label> 
      <div class="controls"> 
      <select id="month" name="month"> 
       <option value="">--Select Option--</option> 
       <option value="1">January</option> 
       <option value="2">February</option> 
       <option value="3">March</option> 
       <option value="4">April</option> 
       <option value="5">May</option> 
       <option value="6">June</option> 
       <option value="7">July</option> 
       <option value="8">August</option> 
       <option value="9">September</option> 
       <option value="10">October</option> 
       <option value="11">November</option> 
       <option value="12">December</option> 
      </select> 
      </div> 
     </div> 
     <div class="control-group"> 
      <label class="control-label">Select Year</label> 
      <div class="controls"> 
      <select id="year" name="year"> 
       <option value="">--Select Option--</option> 
       <option>2017</option> 
       <option>2016</option> 
       <option>2015</option>     
       <option>2014</option>     
       <option>2013</option> 
       <option>2012</option> 
       <option>2011</option>     
      </select> 
      </div> 
     </div> 
     <div class="control-group"> 
      <label class="control-label">Select Employee</label> 
      <div class="controls">    
      <select id="employee" name="employee_name"> 
       <option value="">--Select Option--</option> 
      <?php 
       foreach ($salary as $row) {?> 
       <option value='<?php echo $row->EMPLOYEE_ID;?>'><?php echo $row->EMPLOYEE_NAME;}?></option>     
      </select>    
      </div> 
     </div> 
       <div class="control-group"> 
      <label class="control-label">Select Country</label> 
      <div class="controls">    
      <select id="country" name="org_id"> 
       <option value="">--Select Option--</option>    
       <option value="40">UK</option>   
       <option value="41">INDIA</option> 
       <option value="47">POLAND</option> 
       <option value="57">GERMANY</option> 
      </select>    
      </div> 
     </div> 

이제 첫번째 필드 틸 개월 만의 설정 값은 로컬 스토리지에 저장된 working.On 형태 부하이다. 나머지는 모두 드롭 다운에서 빈 공간을 보여줍니다. 자바 스크립트 코드 :

<script type="text/javascript"> 
    var editingArea = document.getElementById("month"); 
    var editingArea1 = document.getElementById("year"); 
    var editingArea2 = document.getElementById("employee"); 
    var editingArea3 = document.getElementById("country"); 

var KEY = "storageKey"; 
var text = localStorage.getItem(KEY); 
if(text !== null){ 
     editingArea.value = text; 
} 
var KEY = "storageKey"; 
var text1 = localStorage.getItem(KEY); 
if(text1 !== null){ 
     editingArea1.value = text1; 
} 
var KEY = "storageKey"; 
var text2 = localStorage.getItem(KEY); 
if(text2 !== null){ 
     editingArea2value = text2; 
} 
var KEY = "storageKey"; 
var text3 = localStorage.getItem(KEY); 
if(text3 !== null){ 
     editingArea3.value = text3; 
} 

// whenever the textarea is updated, store the contents also into the storage 
editingArea.addEventListener("click", function(event){ 
    localStorage.setItem(KEY,editingArea.value); 
},false); 
editingArea1.addEventListener("click", function(event){ 
    localStorage.setItem(KEY,editingArea1.value); 
},false); 
editingArea2.addEventListener("click", function(event){ 
    localStorage.setItem(KEY,editingArea2.value); 
},false); 
editingArea3.addEventListener("click", function(event){ 
    localStorage.setItem(KEY,editingArea3.value); 
},false); 


var resetButton = document.getElementById("reset"); 
resetButton.addEventListener("click", function(event){ 
    localStorage.setItem(KEY,"");  
    editingArea.value = ""; 
    editingArea1.value = ""; 
    editingArea2.value = ""; 
    editingArea3.value = ""; 
},false); 


    </script> 
+0

각 컨트롤에 대해 동일한 저장 키를 덮어 쓰고 있습니다. 그 이상으로 ' 이제 –

+0

감사합니다. –