How to make a parameter a label picker in the Macro Browser
Asked by Scott Selberg:

So, I've been trying to have one of the macro browser parameter fields work like a label picker. I'm at the point where it's functional; however, for the labels that were already saved in the macro when the remove 'x' is clicked, it not only removes the label but also opens a new page.

So, how do I do this correctly?

```
&lt;?xml version="1.0" encoding="UTF-8"?&gt;&lt;module-container&gt;   &lt;!-- add our i18n resource --&gt;   &lt;resource type="i18n" name="faq" location="/com/keysight/include-content/i18n/faq"/&gt;   &lt;web-resource key="faq-macro-browser-resources" name="Resources for the faq macro in the editor."&gt;       &lt;resource type="download" name="faq-macro-browser.js" location="js/faq-macro-browser.js" /&gt;       &lt;dependency&gt;confluence.editor.actions:editor-macro-browser&lt;/dependency&gt;       &lt;context&gt;macro-browser&lt;/context&gt;   &lt;/web-resource&gt;    &lt;xhtml-macro name="faq" key="faq"                 class="com.keysight.include.content.macros.Faq"                icon="/download/resources/com.keysight.include-content:include-content-resources/images/keysight-logo-80x80.png"&gt;      &lt;category name="confluence-content" /&gt;      &lt;parameters&gt;          &lt;parameter name="labels"                      type="string"/&gt;          &lt;parameter name="spaceKeys"                   type="spacekey"/&gt;          &lt;parameter name="page"                        type="confluence-content"/&gt;          &lt;parameter name="renderStyle" default="Expand"  type="enum"&gt;              &lt;value name="Expand"/&gt;              &lt;value name="Link"/&gt;              &lt;value name="Popup"/&gt;          &lt;/parameter&gt;          &lt;parameter name="renderContent" default="Page"  type="enum"&gt;              &lt;value name="First Excerpt"/&gt;              &lt;value name="First Shared Block"/&gt;              &lt;value name="Page"/&gt;          &lt;/parameter&gt;          &lt;parameter name="popupTitle"                    type="string"/&gt;          &lt;parameter name="andLabels"                     type="boolean"/&gt;          &lt;parameter name="includeDecendants"             type="boolean"/&gt;          &lt;parameter name="includeSpace"                  type="boolean"/&gt;          &lt;parameter name="includeLastModificationDate"   type="boolean"/&gt;          &lt;parameter name="includeLastModificationAuthor" type="boolean"/&gt;          &lt;parameter name="includeLabels"                 type="boolean"/&gt;          &lt;parameter name="includeLikes"                  type="boolean"/&gt;      &lt;/parameters&gt;   &lt;/xhtml-macro&gt;&lt;/module-container&gt;
```

```
(function($) {    var FaqMacroConfig = function() {};    FaqMacroConfig.prototype.beforeParamsSet = function( params, inserting ){       var labels = params.labels.split(",");       $("div.select2-container", $("#macro-param-div-labels")).auiSelect2("val", labels);       return params;    };    FaqMacroConfig.prototype.fields = {        "string" : {            "labels" : function(param, options) {               options = options || {};               var paramDiv = $(Confluence.Templates.MacroBrowser.macroParameter());               var input = $("input", paramDiv);               if (param.required) {                   input.keyup(MacroBrowser.processRequiredParameters);               }               input.auiSelect2(Confluence.UI.Components.LabelPicker.build({                       separator: ",",               }));               return AJS.MacroBrowser.Field(paramDiv, input, options);            }        }    };    AJS.MacroBrowser.Macros["faq"] = new FaqMacroConfig();})(AJS.$);
```

What I have noticed is that without the FaqMacroConfig.prototype.beforeParamsSet call, the values saved into the macro content don't show up. I did try to bind an onclick method to the anchor for the values and disabled the default behavior and propagation; however, when clicked the anchor still opened a new tab.


Answers:
author: Scott Selberg
body: OK, so I think I figured it out.

If you insert the known labels in FaqMacroConfig.prototype.beforeParamsSet, then when the MacroBrowser window is created it will bind a handler to the "a" tag instructing the browser to open a new window. If you insert the labels in FaqMacroConfig.prototype.beforeParamsRetrieved, then they are inserted after the "a" binding operation happens and the undesired behavior goes away.

```
(function($) {    var FaqMacroConfig = function() {};        // this is used to insert the pre-defined values in the macro    // into the auiSelect2 widget.    FaqMacroConfig.prototype.beforeParamsRetrieved = function( params ){        if( params.labels != null ){            $("div.select2-container", $("#macro-param-div-labels")).auiSelect2("val", params.labels.split(",") );        }        return params;    };    FaqMacroConfig.prototype.fields = {        "string" : {            "labels" : function(param, options) {               options = options || {};               var paramDiv = $(Confluence.Templates.MacroBrowser.macroParameter());               var input = $("input", paramDiv);               if (param.required) {                   input.keyup(MacroBrowser.processRequiredParameters);               }               input.auiSelect2(Confluence.UI.Components.LabelPicker.build({                       separator: ",",               }));               return AJS.MacroBrowser.Field(paramDiv, input, options);            }        }    };    AJS.MacroBrowser.Macros["faq"] = new FaqMacroConfig();})(AJS.$);
```

<br />

comments: author: Florian Maupas
body: Omg [@Scott Selberg](/t5/user/viewprofilepage/user-id/853450) you made my week, I have been facing the same situation and I was unable to find any workaround. I will update my post with your link.