2016-03-15 46 views
1

我需要輸入具有特定產品ID的數據並將其保存到本地。點擊按鈕將其保存到本地存儲。一個產品可以有多個文件名。輸入並顯示陣列作爲本地存儲中的對象

在客戶中,如果客戶給出了該ID的名稱,它應該在文本區域中顯示屬於該ID的所有文件名。

<!DOCTYPE html> 
    <html> 
     <title>W3.CSS</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css"> 
      <script type="text/javascript"> 
       var filename = [] 
      var productid = [] 

      function managerClick(){ 
       console.log("manager", productid); 
       console.log("manager", filename); 

       productid.push(document.getElementById("productId").value); 
       filename.push(document.getElementById("names").value); 

       localStorage.setItem("filename", JSON.stringify(filename)); 
       localStorage.setItem("productid", JSON.stringify(productid)); 

       var result={} 
        productid.map(function(k){ 
        result[k]=filename; 
        }) 
        console.log(result);   

       console.log("productid",productid); 
       console.log("filename",filename);  
      }; 
       function customerClick(){ 
        console.log("Customer"); 
       document.getElementById('myTextarea').value = filename; 

      }; 
      </script> 
     <body> 
      <div class="w3-card-4 w3-margin" style="width:50%;">   
       <center>Manager</center> 

       <div class="w3-container"> 
        Product Id: <input type="text" id="productId"><br></br> 
        File Name: <input type="text" id="names"><br></br> 
        <center><button class="w3-btn w3-dark-grey" onclick="managerClick()">Data Entered</button></center><br> 
       </div> 

       <center>Customer</center> 

       <div class="w3-container"> 
        Product Id: <input type="text" id="CustomerpId"><br></br>    
        <center> 
         <button class="w3-btn w3-dark-grey" onclick="customerClick()">Click To get filename</button> 
        </center><br> 
        <textarea rows="4" cols="30"></textarea> 
       </div> 
      </div> 
     </body> 
    </html> 

我需要的是1產品可以有多個文件,但它不應該是其他產品可見。 有人能幫我做嗎?產品1個&產品2的

i tryed like this and i get 

enter image description here

文件名被顯示在這兩種產品 產物1應具有產品1文件1,2,3 產品2應具有產品2文件1,2,3 ,4

+0

你是怎麼得到這個localStorage.getItem( 「myArray的」)?它似乎沒有聲明的名爲myArray的localStorage? –

回答

0

試試這個

<script type="text/javascript"> 

    var productdetail = [] 

    function managerClick() { 

     productdetail.push({ productid: document.getElementById("productId").value, filename: document.getElementById("names").value }); 


     localStorage.setItem("ProductDetails", JSON.stringify(productdetail)); 


    }; 
    function customerClick() { 

     var prod = JSON.parse(localStorage.getItem("ProductDetails")) 
     var selectedProductID = document.getElementById("CustomerpId").value 

     for (var i = 0; i < prod.length; i++) { 
      if (prod[i].productid == selectedProductID) { 
       document.getElementById('myTextarea').value = document.getElementById('myTextarea').value +" "+prod[i].filename; 

        Console.log(prod[i].filename); 
       } 
      } 
     }; 
    </script> 

     <textarea rows="4" cols="30" id="myTextarea"></textarea> 
+1

我已經更新了我的答案。請檢查一下。 –

+0

我不清楚你想實現什麼。如果文件與產品ID 1關聯,那麼我將僅顯示該產品。 –

+0

考慮productid是一個對象和文件名是一個數組,如果我選擇第一個產品的文件名數組必須顯示,如果我選擇第二個產品的第二個產品數組應該顯示,如果我在管理器中輸入第一個id一個新的文件名應該被添加,並且應該顯示在第一個數組ID本身不在其他地方 –