How do i get the amount of labels of current page with JavaScript?

Confluence Development Confluence Server
, , , , ,
1

Hello,

I am looking for a way to get the number of labels from the current page that I have open in the editor.

This script runs when the editor is loaded:

// load editor first
AJS.bind("init.rte", function(){
      var buttonID = "rte-button-publish";
      //check if publish button exist
      if(AJS.$("#" + buttonID).length > 0) {
          //onClick
          AJS.$("#" + buttonID).click(function (e) { 
                console.log("Clicked 'Publish' page button", this);
                var labelbutton = "rte-button-labels";
                // HOW DO I GET THE LABEL COUNT
                if(AJS.$("#" + labelbutton).find(".trigger-text").text() == "Labels")
               {
                      //show alert
                      alert("Please add at least one or more labels!");
                      console.log("Show Alert", this);
                      //Dont finish Action
                      e.preventDefault();
                      console.log("Default prevented", this);
                      e.stopPropagation();
                      console.log("Stoped Propagation", this);
                }

           });
       }
});

Basically only the last the if statement in the code above doesn’t work for me.

I need something like:

if (LABELCOUNT == 0) {DO THIS;}

I am thankful for every help!

2

Hello. I don’t know what you are trying to do, but if your intention is to manage how many labels or interactions the user had with the app I suggest you use some management state API or component, like Redux or React Context API.

Anyway, assuming that this AJS.$ is kinda jQuery selector function, maybe this code can help you accomplish what you’re trying to do:

const labelsArray = [...document.querySelectorAll("#rte-button-labels > .trigger-text")];
const count = labelsArray.filter((label) => label.innerText === "Labels").length;
3

Hi Rafael,

unfortunately this code doesn’t work for me.
When is count = 0 and when is count> 0?

I actually only want the current number of labels added to the page opened in the editor.

here’s an example. In this case count should be 0:

image
image1333×831 13.9 KB

Now count should be 2:

image
image1333×832 14.3 KB

4

Hey, @Florian1702.

Maybe that code I provided you miss some rule on CSS query selector to search for the components on the page. The things you can keep in mind are:

  • You can search the HTML elements on the page using the Document.querySelectorAll function. The result will strictly dependant on how your HTML DOM structure is defined (elements IDs and classes). It will return a NodeList element, which you can convert to an Array to apply operations
  • We need to use some Javascript to search for the label inner text. In this specific case, I searched for the inner text "Labels" as an example, but as your example shows, the labels have different names. This filter operation will result in an array
  • That array size represents the number of elements you are searching for. After that you can use this variable to see if its value is zero or not and display the message you want.

I suggest you inspect this label structure to find the exact CSS selector for your needs. In the example below the element DOM structure is displayed at the bottom. Here I could use the following selectors to select it:

  • #myButton
  • #result.result-iframe > html > body > p > #myButton

image
image2060×744 83.7 KB