2015-11-05 105 views
1
{{#autoForm schema="schema" id="submitoffer" type="method" meteormethod="submitoffer"}} 
     {{> afQuickField name="startLocation"}} 
     <input id="date" type="text" class="form-control datepicker"> 
     <input id="departureTime" type="text" class="form-control timepicker"> 
     <input id="returnTime" type="text" class="form-control timepicker"> 
     {{> afQuickField name="seats" type="number"}} 
     <button type="submit" class="btn btn-primary">Offer lift</button> 
    {{/autoForm}} 

我希望能够使用的日期,departureTime和returnTime输入(这是pickadate.js实现。然而,当我提交表单到服务器,这些投入是。不拿起作为表单的一部分,我怎么能要求他们输入以及与自动窗体提交他们添加自定义输入字段的自动窗体流星

回答

1

你可以使用afFieldInput元素并在架构设置class属性

?例如:

<body> 
    {{#autoForm collection="Offers" id="submitoffer" type="insert"}} 
     {{> afQuickField name="startLocation"}} 
     {{> afFieldInput name="date"}} 
     {{> afFieldInput name="departureTime"}} 
     {{> afFieldInput name="returnTime"}} 
     {{> afQuickField name="seats"}} 
     <button type="submit" class="btn btn-primary">Offer lift</button> 
    {{/autoForm}} 
</body> 

if (Meteor.isClient) { 
    Template.body.onRendered(function() { 
     $('.datepicker').pickadate(); 
     $('.timepicker').pickatime(); 
    }); 
} 

Offers = new Mongo.Collection("offers"); 

Offers.attachSchema(new SimpleSchema({ 
    date: { 
     type: String, 
     label: "Date", 
     autoform: { 
      afFieldInput: { 
       class: "datepicker" 
      } 
     } 
    }, 
    departureTime: { 
     type: String, 
     label: "Departure Time", 
     autoform: { 
      afFieldInput: { 
       class: "timepicker" 
      } 
     } 
    }, 
    returnTime: { 
     type: String, 
     label: "Return Time", 
     autoform: { 
      afFieldInput: { 
       class: "timepicker" 
      } 
     } 
    }, 
    seats: { 
     type: Number, 
     label: "Seats" 
    }, 
    startLocation: { 
     type: String, 
     label: "Start Location" 
    } 
})); 

请注意:上面给出的示例使用领域date String类型。我强烈建议将date值存储为JavaScript Date对象。您可能想要使用beforehook将字符串转换为日期对象。