Question

我正在使用meteor.js中的Jquery.validate（）包来确保将正确的输入放入表单中。

在提交时，我正在使用reactiveVar来更改我的视图输出。如果验证测试通过，我如何才更改reactiveVar？

看起来像这样：

thissite.js：

Template.inquiry.onCreated( function() {
    //toggles 'thank you' on inquiry template
    this.showForm = new ReactiveVar( true );
});

Template.inquiry.onRendered(function(){
    $('#request-form').validate();
});

inquiry.js

Template.inquiry.helpers({

  //toggles 'thank you' on inquiry template
  showForm: function () {
    return Template.instance().showForm.get();
  },

});

Template.inquiry.events({
  'click .submit': function(event, template) {
    template.showForm.set( false );
    Meteor.setTimeout( function() {
      template.showForm.set( true );
    }, 10000); // Reset after 10 seconds.
  },
});

inquiry.html：

<template name="inquiry">

{{#if showForm }}

<form class="request-form" id="request-form" method="post" action="#">
<input type="text" name="name" id="name" value="" placeholder="Name" required />
<input type="email" name="email" id="email" value="" placeholder="Email" required />
<input class="submit" type="submit" value="Send Inquiry" />

{{else}}

Thank You message

{{/if}}

</template>

Answer 1

将您的代码更改为：

    'click .submit': function(event, template) {

        var $form = template.$('.request-form');

        if ($form.valid()) {
            template.showForm.set( false );

            Meteor.setTimeout( function() {
              template.showForm.set( true );
            }, 10000); // Reset after 10 seconds.
        }
    },

Answer 2

Jquery.validate()有回调选项方法submitHandler，您可以在validate plugin docs中阅读相关内容。

Template.inquiry.onRendered(function(){
    $('#request-form').validate({
        submitHandler: function() {...}
    });
});

基于Jquery.validate（）更改reactiveVar会生成meteor.js

2 个答案: