CODEWITHSUNDEEP
meteor
imSonuGupta
imSonuGupta

Reputation: 925

Meteor Template events, Showing error "Template not define"

I have code like following:

in test.html

<template name="main">
            <table class="table table-bordered table-striped table-condensed">
                <thead>
                    <tr>
                        <td>Name</td>
                        <td>City</td>
                        <td>Email</td>
                    </tr>   
                </thead>
                <tbody>
                    {{#each users}}
                    <tr>
                        <td>{{names}}</td>
                        <td>{{city}}</td>
                        <td>{{email}}</td>
                    </tr>
                    {{/each}}
                    <tr>
                        <td><input type="text" name="names" id="names" value=""></td>
                        <td><input type="text" name="city" id="city" value=""></td>
                        <td><input type="text" name="email" id="email" value=""></td>
                    </tr>
                </tbody>    
            </table>
     <button class="btn" id="add">Add</button>
</template>

in test.js

UserInfo = new Meteor.Collection('users');
if (Meteor.isClient) {
  Template.main.users=function() {
    return UserInfo.find();
  }
}
 Template.main.events({
    'click #add': function () {
      var names = $('#names').val();
      var city = $('#city').val();
      var email = $('#email').val();
      UserInfo.insert({names:names,city:city,email:email});
    }
  });

After clicking on add button i want to take input data(name, location and email) and insert data in to the table but it is showing some error like "template not define".

Upvotes: 0

Views: 70

Answers (1)

Rajanand02
Rajanand02

Reputation: 1303

You should move the Template code inside client block and also creating individual helpers is deprecated. Use helpers block instead.

if (Meteor.isClient) {
 Template.main.helpers({
  users: function() {
    return UserInfo.find();
 }
 });
 Template.main.events({
  'click #add': function () {
    var names = $('#names').val();
    var city = $('#city').val();
    var email = $('#email').val();
    UserInfo.insert({names:names,city:city,email:email});
  };
 });
}

Upvotes: 4

Related Questions