Problem with Subscription

help
1

Hi,

Im relatively new to meteor and javascript. Im trying to have my Mongo Collection fill a drop down list, but it doesnt seem to be working:

In my server folder I have the following:

/server/publications/publications.js

import { Meteor } from 'meteor/meteor'


Meteor.publish('states', function() {


	return States.find({});


});

/server/collections/collections.js

import { Mongo } from 'meteor/mongo';

States = new Mongo.Collection('states');

and
In my client-side template I have the following:

Template.AddCity.onCreated(function () {
    var self = this;

  self.autorun(function() {
    //Subscribe to all clubs
    self.subscribe("states");

  });
 

  });

  Template.AddCity.onRendered(function () {
   
  });

  Template.AddCity.helpers({
    
    state (){

        return States.find({});
    },
  });

and the html template:

<template name="AddCity">
        <form >
                <div style="border-style:solid;border-color:black">
                        <h3>Add City</h3>
                        <hr style="color:black">
            <select id="statename">
                <option>Please Select State</option>
                {{#each state}}
                <option value={{statecode}}>{{statename}}</option>
                {{/each}} 
            </select>
            <br>
            <br>
            <input id="addcitynametext" type="text" name="cname" placeholder="City Name"><br>
  <br>
            <input id="addcitybutton" class="btn" type="submit" value="Submit">
            </div>
            <br>
              </form>

</template>

When I go to fetch the states in the Developer Console, I get an Uncaught reference error that States cannot be found. Any help would be appreciated;

thanks,

Sabin

2

Could you please edit your post and wrap your code blocks in lines with triple-backticks:

```
like
this
```

Thanks :slight_smile:

3

You need to import the definition of your collection State in the server as well as the client code

import '/server/collections/collections.js';

Template.AddCity.onCreated(function () {
    var self = this;
    //Subscribe to all clubs - no need for autorun since subscription is not changing
    self.subscribe("states");
  });

in the template

<template name="AddCity">
  {{#if Template.subscriptionsReady}}
  <form >
    <div style="border-style:solid;border-color:black">
      <h3>Add City</h3>
      <hr style="color:black">
      <select id="statename">
        <option>Please Select State</option>
        {{#each state}}
        <option value={{statecode}}>{{statename}}</option>
        {{/each}} 
      </select>
      <br>
      <br>
      <input id="addcitynametext" type="text" name="cname" placeholder="City Name"><br>
      <br>
      <input id="addcitybutton" class="btn" type="submit" value="Submit">
    </div>
    <br>
  </form>
  {{/if}}
</template>
4

thanks man! worked perfectly