形成價值觀

Question

Template.dpVar.events = { 
     'submit .add-product-form' : function (evt) { 
      evt.preventDefault(); //prevent form to change URL 
      var form = evt.target; //this is the .add-product-form element 
      console.log("testing", form); 
      console.log(result); 
      data = {}; 
      var len=result.length; 
      console.log("len is",len); 
      for (i = 0; i <= result.length; i++) { 
       alert(i); 
       alert(result[i]) 
       var tempName = result[i]; 
       if (form[tempName] !== void 0) { 
        alert("IF") 
        var tempVal = result[tempName].value; 
        console.log("temp name is ", tempName); 
        data[tempName] = tempVal; 
        console.log("temp val is ", tempVal); 
       } 
      } 
      productDB.insert(data); 
     } 
    } 

控制檯輸出：

HTML頁：

<template name="dpVar"> 
    <h1>variants</h1> 

    <!-- here is our form --> 
    <form class="add-product-form"> 
     <table class="table table-responsive table-bordered"> 
      <tbody> 
      {{#each variant}} 
      {{#each VARIENTS}} 
      {{#if $eq this.DATATYPE "Text"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td> 
        <input type="text" class="variables" name="{{this.NAME}}" value={{this.NAME}}> 
       </td> 

      </tr> 
      {{/if}} 

      {{#if $eq this.DATATYPE "price"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td><input type="text" name="{{this.NAME}}" value={{this.NAME}}></td> 
      </tr> 
      {{/if}} 

      {{#if $eq this.DATATYPE "color"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td> 
        <div> 
         <select name={{this.NAME}}> 
          <option>Color</option> 
          <option value="Green">Green</option> 
          <option value="White">White</option> 
          <option value="Red">Red</option> 
          <option value="Blue">Blue</option> 
         </select> 
        </div> 
       </td> 
      </tr> 
      {{/if}} 

      {{#if $eq this.DATATYPE "boolean"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td><input type="radio" name={{this.NAME}}></td> 
      </tr> 
      {{/if}} 

      {{#if $eq this.DATATYPE "checkbox"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td><input type="checkbox" name={{this.NAME}}></td> 
      </tr> 
      {{/if}} 
      {{#if $eq this.DATATYPE "string"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td><input type="text" name={{this.NAME}}></td> 
      </tr> 
      {{/if}} 
      {{#if $eq this.DATATYPE "date"}} 
      <tr> 
       <td class="center">{{this.NAME}}</td> 
       <td><input data-provide="datepicker" type="text" name={{this.NAME}}></td> 
      </tr> 
      {{/if}} 
      {{/each}} 
      {{/each}} 
      </tbody> 
     </table> 

     <!-- here I added type="submit" for button, so it submits the form --> 
     <button class="btn btn-success addproduct" id="CreateNewProduct" type="submit">Create new product</button> 
    </form> 
</template> 

問題：

DB條目應爲 { 「品牌」 ：，「價格」：，等等}

當前DB：正在創建空白條目。

Answer 1

我寫了類似的應用程序，它適用於我。

productDB = new Mongo.Collection('productDB'); 

if (Meteor.isClient) { 
    result = ['Brand', 'Color', 'Price']; 
    Template.dpVar.events = { 
    'submit .add-product-form' : function (evt) { 
     evt.preventDefault(); //prevent form to change URL 
     var form = evt.target; //this is the .add-product-form element 
     console.log("testing", form); 
     console.log(result); 
     data = {}; 
     for (i = 0; i < result.length; i++) { 
      var tempName = result[i]; 
      if (form[tempName] !== void 0) { 
       var tempVal = form[tempName].value; 
       console.log("temp name is ", tempName); 
       data[tempName] = tempVal; 
       console.log("temp val is ", tempVal); 
      } 
     } 
     productDB.insert(data); 
    } 
    } 
} 

HTML：

<template name="dpVar"> 
    <h1>variants</h1> 

    <!-- here is our form --> 
    <form class="add-product-form"> 
    <table class="table table-responsive table-bordered"> 
     <tbody> 
      <tr> 
       <td class="center">Color</td> 
       <td> 
       <input type="text" name="Color"> 
       </td> 

      </tr> 

      <tr> 
       <td class="center">Brand</td> 
       <td><input type="text" name="Brand"></td> 
      </tr> 
     </tbody> 
    </table> 

    <!-- here I added type="submit" for button, so it submits the form --> 
    <button class="btn btn-success addproduct" id="CreateNewProduct" type="submit">Create new product</button> 
    </form> 
</template>