3

Meteor 0.5.7 を実行していて、ユーザーが送信をクリックしたときにブートストラップ アラート メッセージを表示しようとしています。

client.js

Handlebars.registerHelper('isSuccessful',function(input){
  return Session.get("success");
});    

Template.form.events({
  'click .submit' : function (event, template) {
     if (condition) {
        Session.set("success", true);
        // hide warning, show success
        $('#valid_form').show();
        $('#invalid_form').hide();
     } else {
        Session.set("success", false);
        // hide success, show warning
        $('#valid_form').hide();
        $('#invalid_form').show();
     }
  } 
});

Template.form.rendered = function () { $('.alert').hide();};

page.html

<body>
   {{> page}}
</body>

<template name='page'>
  {{> form}}
</template>

<template name='form'>
   <!-- Show Alerts Above Form -->
   <div class="alert alert-success" id="valid_form">..</div>
   <div class="alert" id="invalid_form">..</div>

   {{#if isSuccessful}}
     <div>SHOW CONFIRMATION PAGE</div>
   {{else}}
    <div>SHOW INPUT FIELDS</div>
   {{/if}}
   <div>   
</template>

ユーザーが最初に [送信] をクリックし、条件が満たされない場合、警告メッセージを表示するには、再度 [送信] をクリックする必要があります。それ以外の場合はすべて、ロジックが機能します。

私はこれを見てきました-Meteorの反応性は舞台裏でどのように機能しますか? 、リアクティブ プログラミング パーツに関する Meteor のドキュメントを読み直しましたが、まだ何かが間違っています。

クライアントのelseステートメントはデフォルトでsuccess == falseのセッション変数になり、ハンドルバーテンプレートは{{else}}ブロックですぐにそれを取得するべきではありませんか? 少し混乱しています。ありがとう、

4

2 に答える 2

3

私の質問への答えは、ハンドルバー登録ヘルパーで return Session.get("success") を return Session.equals("success",true) に変更するとうまくいったようです。私が読んでいるものから、「無効化」が少ないですか？- atm が何を意味するのかわかりませんが、それは始まりです!

于 2013-03-12T05:15:38.530 に答える
2

目的が条件に関連するアラートを非表示/表示することである場合は、代わりにこれを実行できます。

client.js

Template.form.rendered = function() {
  // hide all alerts when elements are rendered
  $('.alert').alert('hide');
}

Template.form.events({
  'click .submit' : function (event, template) {
    if (condition) {
      // hide warning, show success
      $('#valid_form').alert();
      $('#invalid_form').alert('hide');
    } else {
      // hide success, show warning
      $('#valid_form').alert('hide');
      $('#invalid_form').alert();
    } 
  } 
});

page.html :

<body>
  {{> page}}
</body>

<template name='page'>
  {{> form}}
</template>

<template name='form'>
  <div class="alert alert-success" id="valid_form">..</div>
  <div class="alert" id="invalid_form">..</div>
</template>
于 2013-03-11T20:03:43.153 に答える