简体   繁体   English

流星事件触发了错误的方法

[英]Meteor event fires the wrong method

This Meteor client code when the button CLEAR is hit, the browser console prints Check entries but that is only expected to fire when the INFO buttons is clicked and only if plate is null. 按下按钮CLEAR时,此Meteor客户端代码会在浏览器控制台上显示Check entries但仅当单击INFO按钮且plate为null时才预期触发。
What did I do wrong and how to fix it? 我做错了什么以及如何解决? thx 谢谢

Template.body.events({
  'submit form': function (event) {
   event.preventDefault();
   footerInfo();
 }
});

Template.footer.events({
  'click #clear': () => {
    Session.set('busy', false);
    document.getElementById('plate').value = '';
    Session.set('plate', '');
    searching = '';
  },
  'click #info': () => {
    footerInfo();
  }
});

footerInfo = () => {
  let plate = document.getElementById('plate').value;
  if (!plate) {
    console.log('Check entries');  //<-- prints even when CLEAR is clicked.
    Session.set('busy', false);
    return;
  }
  Session.set('plate', plate);
  let doc = myCol.findOne({plate: Session.get('plate')});
};
<body>
  <div id="main">
    <div id="content">
      <form>
        <button type="submit" style="display:none"></button>
            {{> content}}
            {{> footer}}
      </form>
    </div>
  </div>
</body>

<template name="content">
    <input type="text" id="plate" autocomplete="off">
</template>

<template name="footer">
  <footer>
    <button id="clear">CLEAR</button>
    <button id="info">INFO</button>
  </footer>
</template>

in general, you'd probably want to use Meteor form submit functionality to handle this (cf https://www.meteor.com/tutorials/blaze/forms-and-events ) but your setup is a little weird because the buttons are in a different template than the form is in. 通常,您可能希望使用Meteor表单提交功能来处理此问题( 参阅https://www.meteor.com/tutorials/blaze/forms-and-events ),但是您的设置有些奇怪,因为按钮是与表格所使用的模板不同。

here, i would likely keep the overall structure, and add a "event.preventDefault()" at the top of each event handler. 在这里,我可能会保留整体结构,并在每个事件处理程序的顶部添加一个“ event.preventDefault()”。

if for some reason that doesn't work, also add an "event.stopImmediatePropagation()". 如果由于某种原因不起作用,请添加“ event.stopImmediatePropagation()”。

but i think this should do it: 但我认为应该这样做:

Template.footer.events({
  'click #clear': (event) => {
    event.preventDefault();
    Session.set('busy', false);
    document.getElementById('plate').value = '';
    Session.set('plate', '');
    searching = '';
  },
  'click #info': (event) => {
    event.preventDefault();
    footerInfo();
  }
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM