Sekoul
Sekoul

Reputation: 1371

meteor.js - pass id of element clicked to a collection

I've built a page with 3 elements, each of which looks like this:

<div class="col-md-4 event-type">
<a href="{{ pathFor 'step2' }}" id="eventchoice" name="eventchoice" value="corporate">
</a>
</div>

I'm trying to pass the value or name or id of the the <a> element on to a collection using the following code:

EventsController.events({
    'click #eventchoice' : function(event) {
        console.log(event.target.getAttribute("id"));
        console.log(event.target.getAttribute("name"));
        console.log(event.target.getAttribute("value"));

        var eventchoice = event.target.value;   
        var params = {
            eventchoice: eventchoice 
        }

        //Insert Event
        Meteor.call('addEvent', params);
        FlashMessages.sendSuccess('Event Added');
    }
});

I added the console.log's to see if I can get the id/name/value of the <a> element, but the console outputs 'null' for all of these. Therefore, there is nothing to pass to the collection in the eventAdd method.

I don't believe the problem is with the EventsController, the addEvent method or the Events collection. Any ideas how I can pass these values through?

Thank you for your help!

Upvotes: 2

Views: 579

Answers (2)

durrrr
durrrr

Reputation: 352

I think there must be something wrong with your controller then, because if you check the Meteorpad here, it works just fine. Although you might want to use a class instead of an id if you have many similar elements.

Upvotes: 2

Erez Hochman
Erez Hochman

Reputation: 1708

There are several ways of solving your problem but the way I consider as "The Meteor Way" is to use a separate template for every choice (or just use #each loop), if you do that your "this" inside the event code will contain the values you need in your scope, so you won't have to rely on the event.target for them.

Upvotes: -1

Related Questions