0

I'm using the following package:

https://github.com/aldeed/meteor-plans-stripe

HTML:

<button id="upgrade" type="button" data-plan="monthly">Upgrade</button>

<button id="upgrade" type="button" data-plan="yearly">Upgrade</button>

Controller:

Template.billingOverview.events({
  "click #upgrade": function(){
      var plan = $(this).data('plan');
      AppPlans.set(plan);
    });
  }
});

I want to grab the data from 'data-plan' from each button clicked by the user and set the parameter inside AppPlans. Problem is $(this) keeps returning undefined but works fine if I set $(this) to $('#upgrade') but I only grabs the data from the first #upgrade element.

How would I grab the data-plan from the specific button that the user clicks?

  • `id` is for _unique_ elements. Also read [this](http://stackoverflow.com/questions/1051782/jquery-this-vs-this). – jmargolisvt Apr 16 '16 at 01:44

1 Answers1

1

You could try following:

HTML

<button class="upgrade" type="button" data-plan="monthly">Upgrade</button>

<button class="upgrade" type="button" data-plan="yearly">Upgrade</button>

JS

Template.billingOverview.events({
  "click .upgrade": function(event, template){
    var plan = event.target.dataset.plan;
    AppPlans.set(plan);
  }
});

It works, I've checked it ;)

Nazar Yablonskiy
  • 73
  • 7