流星在初始加載時更改表單值

Question

我想知道如何在初始頁面加載時設置表單的值？ 我可以更改事件上的值，例如某個元素上的點擊事件（提交按鈕），但是如何在頁面加載時執行此操作。

我的HTML

 <table class="table table-striped table-condensed table-hover rsk-tbl vScrollTHead"> 
<tr> 
<td><input class="form-control input-lg" name="submit_date_day" type="text" placeholder="Day"/> </td> 
      <td><input class="form-control input-lg" name="submit_date_month" type="text" placeholder="Month"/> </td> 
      <td><input class="form-control input-lg" name="submit_date_year" type="text" placeholder="Year"/> </td> 
     </tr> 



     <tr> 
     <td><input class="form-control input-lg" name="submit_car" type="text" placeholder="Car"/> </td> 
     <td><input class="form-control input-lg" name="submit_dist" type="text" placeholder="Distance"/> </td> 
     </tr> 

     <tr> 
     <td><input class="form-control input-lg" name="submit_a" type="text" placeholder="Location A"/> </td> 
      <td><input class="form-control input-lg" name="submit_b" type="text" placeholder="Location B"/> </td> 
     </tr> 
    </table> 

的Javascript

Template.trip_html.events({ 
var day = event.target.submit_date_day.value; 
var month = event.target.submit_date_month.value; 


var year = event.target.submit_date_year.value; 

var car = event.target.submit_car.value; 
var b = event.target.submit_b.value; 
var a = event.target.submit_a.value; 
var dist = event.target.submit_dist.value; 


if(empty(day) || empty(month) || empty(year) || empty(car) || empty(b) || empty(a) || empty(dist)){ 
return false; 
} 

if(!isNumeric(day) || !isNumeric(month) || !isNumeric(year) || !isNumeric(dist)){ 
    return false; 
} 

if(day.startsWith("0")) 
day = day.replace("0", ""); 

if(month.startsWith("0")) 
month = month.replace("0", ""); 

if(year.startsWith("0")) 
year = year.replace("0", ""); 

console.log(day, month, year, car, a, b, dist); 
Meteor.call('addTrip', day, month, year, car, a, b, dist); 

event.target.submit_a.value = event.target.submit_b.value; 
event.target.submit_b.value = ''; 
event.target.submit_dist.value = ''; 


}}); 

我想要的初始頁面加載能有今天的日，月，年，一旦人點擊提交按鈕，它保持不變（使人們可以提交昨天，甚至去年）

Answer 1

您是否嘗試過在窗體中設置默認值？

對於使用火焰流星，這是我會怎麼做：

HTML

<template name="trip_html"> 
<table class="table table-striped table-condensed table-hover rsk-tbl vScrollTHead"> 
<tr> 
<td><input class="form-control input-lg" name="submit_date_day" type="text" placeholder="Day" value={{getDay}} /> </td> 
<td><input class="form-control input-lg" name="submit_date_month" type="text" placeholder="Month" value={{getMonth}} /> </td> 
    <td><input class="form-control input-lg" name="submit_date_year" type="text" placeholder="Year" value={{getYear}} /> </td> 
</tr> 
</table> 
</template> 

的JavaScript

var today = new Date(); 

Template.trip_html.helpers({ 
getDay() { 
    return today.getDate(); 
}, 
getMonth() { 
    return today.getMonth()+1; 
}, 
getYear() { 
    return today.getFullYear(); 
} 
}); 

見https://www.w3schools.com/tags/att_input_value.asp

至於第二部分的問題，「一旦點擊提交按鈕，它保持不變，」我不是確切地確定你的意思。但是，如果你的意思是每個用戶都有一個表單，那麼你可以給helper函數添加邏輯來檢查這個用戶是否已經提交了表單並從集合中提取值，而不是將其設置爲今天的日期。

我認爲你想要做的關鍵是1）在你的輸入元素中使用值屬性和2）爲你的模板使用助手函數。

希望這給你一些想法！

Answer 2

我做什麼是我加了一些反應變量下

HTML

<tr> 
    <td><input class="form-control input-lg submit_day" name="submit_date_day" type="text" value={{submit_dayvalue}} placeholder="Day"/> </td> 
    <td><input class="form-control input-lg" name="submit_date_month" type="text" value={{submit_monthvalue}} placeholder="Month"/> </td> 
    <td><input class="form-control input-lg" name="submit_date_year" value={{submit_yearvalue}} type="text" placeholder="Year"/> </td> 
</tr> 

JS（客戶端）

Template.trip_html.helpers({ 

submit_yearvalue: function(){ 
var currentTime = new Date(); 
var currentYear = currentTime.getFullYear(); 
return currentYear; 

}, 

filter_year: function(){ 
var currentTime = new Date(); 
var currentYear = currentTime.getFullYear(); 
return currentYear; 

}, 

submit_monthvalue: function(){ 
var currentTime = new Date(); 
var currentMonth = currentTime.getMonth(); 
return currentMonth+1; 

},