Multiple instances of the same macro on one page

I am new to the macro development and I have the following issue with my macro plugin.
I am creating a template in a .vm file which I am populating from a RestService, but when there are multiple instances of the macro on a page I cannot address each of the elements in the javascript which leads to failing behaviour of the macro as there now multitudes of each component to which I want to bind ajax calls.
So what should I do to namespace my components properly?
I guess I could use the macro id and add it to each button in the .vm but how can I pass the id to the js context to address it in a velocity like way?

I hope I made my issue clear, communicating a problem is hard…
Thanks in advance.

It depends on what you’re doing etc. What we do for Build Status for Confluence is to generate our id based on the configuration parameters. That way if 2 macros share the same configuration, there is only one rest call issued to the backend…

Hi @georg.grauberger,

when ýou are already developing a macro plugin, then you could do the REST stuff in a Java class. Maybe you won’t even need REST for that at all. If it is in the same Confluence instance, just call the classes you need. Maybe some example code would clarify the problem.

Best regards

To address each of your macros on the page, you can use JS (say at js/macro.js) to loop through your macro instances:

AJS.toInit(function ($) { // yes, this example uses jQuery 😎
  $('.my-macro-class').each(function () { 
    // * also, see below
    var $self = $(this);
    $.ajax({ url: '/your/rest/api'}) // TODO: update your URL
      .done(function (response) {
        $self.append('<pre>' + JSON.stringfy(response) +'</pre>'); // TODO: better content formatting here

The JS would need to be added as a web resource in your atlassian-plugin.xml:

<web-resource key="macro-resources" name="Macro Resources">
  <resource type="download" name="macro.css" location="css/macro.css"/>
  <resource type="download" name="macro.js" location="js/macro.js"/>

Then also include your web resource in the macro vm file:


*You could also add a data-your-macro-id or similar to each of your root macro element so that you can reference it by some distinct hook later if needed.