2017-02-16 7 views
0

初期ページロード時にフォームの値を設定するにはどうすればいいですか? 特定の要素([送信]ボタン)のイベントをクリックするなど、イベントの値を変更できますが、ページの読み込み時にどのように行うのですか。メテオ初期ロード時のフォーム値の変更

マイ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 = ''; 


}}); 

が、私は今日一日持っている最初のページのロード、月と年をしたい人は、送信ボタンをヒットしたら、それは同じ(ように人々がすることができますとどまります昨日から昨年に送信)

答えて

0

フォームにデフォルト値を設定しようとしましたか?これは私がしたいものです炎を使用して流星と

、:

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

を参照してください。質問、 "一度人が送信ボタンを押すと、それは同じままです、"私はしていないあなたが何を意味するのかを正確に確かめてください。しかし、各ユーザーがフォームを持っている場合は、ヘルパー関数にロジックを追加して、このユーザーがフォームをすでに送信しているかどうかを確認し、今日の日付に設定するのではなく、コレクションから値を取り出すことができます。

あなたがしたいことのキーは、1)入力要素にvalue属性を使用し、2)テンプレートにヘルパー関数を使用することです。

これはあなたにいくつかのアイデアを提供します。私が何をしたか

+0

ええ、私はその事をしたを追加しましたです。そしてそれは完璧に働いた。それは少し早いですが、それでも大変ありがとうございました! –

0

は、私はいくつかの反応性varibles

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(CLIENT)

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; 

}, 
関連する問題