How to add a submit button in Meteor.js?

Question

Template.feed.events = ({

// Press enter to submit the post.
'keypress, .posttext':function(evt,tmpl){
    if(evt.which == 13){
        var posttext = tmpl.find('.posttext').value;
        var options = {text:posttext,parent:null};
        Meteor.call('addPost',options);
        $('.posttext').val("").select().focus();
    }
}

I am not so good with Meteor or javascript, are there any good resources that will break down Meteor into a basic understanding? Thanks!

Answer 1

Here's the correct way of handling a submit button:

// client/yourtemplate.html
<template name="yourForm">
  <form>
    <input type="text" class="posttext">
    <input type="submit" value="Submit post">
  </form>
</template>

// client/yourfile.js
Template.feed.events = {
  // "submit form" handles all types of form submission: pressing Enter in
  // the input text field, clicking the button, or tabbing to it then
  // pressing Enter
  'submit form': function (event, template) {
    event.preventDefault();  // disable the browser's form submission
    var posttext = template.find('.posttext').value;
    ...
  }
};

Note that in the low-level keypress approach, you had an extra comma between keypress and .posttext . The even selector syntax is eventtype selector , and commas separate different selectors .

That said, welcome to Meteor! A few pointers:

1. Try to follow the Meteor style guide and place a space after punctuation (see more at https://github.com/meteor/meteor/wiki/Meteor-Style-Guide )
2. There is an excellent resource for learning the very basics of JavaScript and Meteor at the same time: David Turnbull's Complete Beginner's Guide to the Meteor JavaScript Framework .