How to create a month Dropdown list in meteor?

help
1

I’m building a monthly resolution app… so i need a month selection dropdown and it also need to be display the month along with the task which is created by the user on the screen. any idea how to do it in meteor ? by the way i’m new to meteor! thanks in advance :smile:

2

a HTML select tag will give you a month drop down:

 <select>
    <option value disabled selected>--Select Month--</option>
    <option value='1'>Janaury</option>
    <option value='2'>February</option>
    <option value='3'>March</option>
    <option value='4'>April</option>
    <option value='5'>May</option>
    <option value='6'>June</option>
    <option value='7'>July</option>
    <option value='8'>August</option>
    <option value='9'>September</option>
    <option value='10'>October</option>
    <option value='11'>November</option>
    <option value='12'>December</option>
    </select>

I’m not sure on your second requirement. It doesn’t make sense? You want to display the month entered in the form? Save the month into the collection and use it later.

1 Like
3

Thank u very much! :smile:
btw i want to display the selected specific month from the dropdown… for instance when a user enter a task (to-list) in the input field that i just created and select a month which that task to be assign. then i need to display the task that user just created and the month her/she selected ( task that created : month selected ) like this! Really appreciate ur help :smile:

4

If you end up needing to do… well even basic things with dates I really have come to love moment.js it’s in atmosphere so it’s super easy to add

1 Like
5

Create a template event that gets value of your select field and puts it to reactive variable. Then use this reactive variable (or helper that returns its value) in your template elsewhere.

1 Like
6

I created a meteorpad for you

It is a bit more extensive that a hard-coded select, showing you

  • how you can build the option list
  • how you can retrieve the selected item
  • and how you can use the retreieved item elsewhere in your code
1 Like
7 
<option value={{monthId}} {{#if isDefault}} selected {{/if }} >{{monthName}}</option>
1 Like
8

Hi,
I made you a quick example here: http://meteorpad.com/pad/vuEN6rDzY4r3fXhx3/Month%20selector%20test

P. S.: I am also new to Meteor, so any corrections/suggestions are welcome.

1 Like
9

Thank u all guys! :smile:

10

Hi,
I know it’s been a while since this topic was created and answered but I’ve got the problem that you guys solved. I mean, the Meteorpads links are dead and I do want to learn :

  • how you can build the option list
  • how you can retrieve the selected item
  • and how you can use the retreieved item elsewhere in your code

I can’t find any tutorial on the web about this.

Please don’t be mad for the up (or tell me where I should post/search).
Thank you anyway.