【问题标题】:Trying to do form validation on a a meteor form submit with jquery plugin from atomsphere尝试使用来自 atomsphere 的 jquery 插件对流星表单提交进行表单验证
【发布时间】:2014-12-14 00:39:12
【问题描述】:

我想在流星js中使用这个插件https://github.com/DiegoLopesLima/Validate

现在当我 console.log $('form').validate();

我明白了

[form.mainForm, selector: "form", context: document, jquery: "1.11.0", constructor: function, toArray: function…]

我期待的是真或假,然后我可以在验证为真或假时提交表单。

这是我的提交事件。

Template.contactSubmit.events({
  'submit form': function(e) {
    e.preventDefault();


    var post = {
      email: $(e.target).find('[name=email]').val(),
      name: $(e.target).find('[name=name]').val(),
      question: $(e.target).find('[name=question]').val(),
      found_us: $(e.target).find('[name=found_us]').val()

    };

  $('form').validate();

    post._id = Contacts.insert(post);
    Router.go('acorn', post);
  }
});

这是我的提交模板 注意第一个输入中的 data-required

<template name="contactSubmit">
  <form class="mainForm">
    <div class="control-group">
        <label class="control-label" for="email">email</label>
        <div class="controls">
            <input data-required name="email" type="text" value="" placeholder="Your email"/>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="name">name</label>
        <div class="controls">
            <input name="name" type="text" value="" placeholder="name"/>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="question">question</label>
        <div class="controls">
            <textarea name="question" type="text" value="What do you want to build?"></textarea>
        </div>
    </div>

    <div class="control-group">
        <label class="control-label" for="found_us">found us</label>
        <div class="controls">
            <textarea name="found_us" type="text" value="How did you find us?"></textarea>
        </div>
    </div>

    <div class="control-group">
        <div class="controls">
            <input id="submitContact" type="submit" value="Submit" class="btn btn-primary"/>
        </div>
    </div>
  </form>
</template>

【问题讨论】:

    标签: javascript jquery forms validation meteor


    【解决方案1】:

    您没有按应有的方式使用该插件。它期望像这样的有效回调:

    $('form').validate({
        sendForm: false,
        valid: function() {
            // Here is the code you want to run when the form is valid
            console.log("valid !");
        }
    });
    

    【讨论】:

    • 谢谢。我一回到家测试就选择答案:)
    • 不客气,很高兴它有帮助,我在家里测试了它,它成功了。如果你坚持下去,我会在那里。
    猜你喜欢
    • 2023-04-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-11-16
    • 1970-01-01
    • 2016-10-28
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多