Meteor.js:提交事件而不是解雇

时间:2014-11-08 03:51:51

标签: meteor

我刚刚开始尝试使用Meteor,我注意到如果我在页面上有2个表单,它似乎只处理一个事件。我必须分离需要在同一页面上的表单,一个嵌套在另一个模板中。现在嵌套表单将提交并且事件将触发,但composeMessageForm事件将永远不会触发。我之前遇到过另一个我正在尝试的项目。

这是主要的.js文件:(我也知道第一个事件中可能存在错误,我只是永远无法触发事件,所以我可以解决它。

Template.inbox.events({
    "submit .composeMessageForm": function(event) {
      var to = event.target.to.value;
      var text = event.target.message.value;
      alert(to);
      if($.trim(text) != '' && $.trim(to) != '')
      {
        var foundUser = Users.findOne({username: to});
        if(foundUser)
        {
          if(!Conversations.find({from: username, to:foundUser.username}))
          {
            var c = Conversations.insert({
              from: username,
              to: foundUser.username,
              createdAt: new Date()
            });
            if(c)
            {
              Messages.insert({
                conversationId: c._id,
                from: username,
                text: text,
                sentAt: new Date()
              });
            }
          }
          else
          {
            console.log("Can't recreate conversations!");
          }
        }
        else
        {
          alert("No such user exists.");
        }
      }
      event.target.to.value   = "";
      event.target.text.value = "";
      return false;
    }
  });

  Template.inbox.helpers({
    conversations: function() {
      return Conversations.find({$or: [{from: username}, {to: username}]});
    }
  });

  Template.conversation.events({
    "submit .newMessageForm": function(event)
    {
      var conversationId = event.target.conversationId.value;
      var text = event.target.text.value;
      if($.trim(text) != '')
      {
        Messages.insert({
          conversationId: conversationId,
          text: text,
          from: username,
          sentAt: new Date()
        });
      }
      event.target.text.value = "";
      return false;
    }
  });

这是模板:

<template name="inbox">
  <div class="composeMessage" style="margin-bottom:15px;">
    <form class="composeMessageForm">
      <input type="text" name="to" placeholder="Username" />
      <input type="text" name="message" placeholder="Message..." />
    </form>
  </div>
  <div class="inbox">
    {{#each conversations}}
      {{> conversation}}
    {{/each}}
  </div>
</template>

<template name="conversation">
  <div class="conversation" id="conversationId-{{_id}}">
    {{#if equals currentUser.username from}}
      <strong>{{to}}</strong><br /><br />
    {{else}}
      <strong>{{from}}</strong><br /><br />
    {{/if}}
    <div class="messages">
      {{#each findMessagesForConversation ./_id}}
        <div>{{from}}: {{text}}
        <i>Sent {{formatDateSince sentAt}} ago.</i>
        </div>
      {{/each}}
    </div>
    <div class="newMessage">
      <form class="newMessageForm">
        <input type="text" name="text" placeholder="Message here..." />
        <input type="hidden" value="{{./_id}}" name="conversationId" />
      </form>
    </div>
  </div>
</template>

编辑:!

所以我似乎已经通过在表单中​​放置一个提交按钮将其破解为工作,但随后隐藏了它的可见性,以便您无法看到它。

0 个答案:

没有答案