Venkat
Venkat

Reputation: 841

Button Event Issue using Jquery in Meteor?

I need to know about using Jquery framework in Meteor.I did a simple example with using Jquery button event but get some errors.I didn't get any idea about this errors.So please see the below code and suggest me what to?

HTML Code :

app.html
--------

<head>
  <title>app</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>

<body>
  {{> menu}}
</body>

menu.html
---------

<template name="menu">

<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button>

</template>

JS Code :

if (Meteor.isClient) 
{
 Template.menu.events
     ({
         $(document).ready(function()
        {
          $("button").click(function()
           {
             $("p").hide();
            });
        });
      });
    }

Error Message :

Your app is crashing. Here's the latest log.

=> Errors prevented startup:

While building the application:
client/menu.js:5:7: Unexpected token (

=> Your application has errors. Waiting for file change.

Upvotes: 0

Views: 116

Answers (1)

user728291
user728291

Reputation: 4138

See meteor event maps documentation for examples of options for Template.menu.events(). Your click function could be written like this:

Template.menu.events({
  'click button': function(){
    $("p").hide();
  } 
});

If you need to use jquery to add an event, a better place is in your templates rendered function. Like this:

Template.menu.rendered = function(){
  $("button").click(function(){
     $("p").hide();
  });
};

Upvotes: 2

Related Questions