Trying to get checkbox macro to work with Confluence 7.13

Rafer Gluyas

I've taken the topic solution from here, and updated it for new access to the underlying model, however from what I can see it isn't executing the click function - but cannot work out what I'm missing. 

 

## @noparams

#set ( $props = $content.getProperties() )
#if($content.getProperties().getStringProperty("submit") == "true" && $content.getProperties().getStringProperty("checkbox") && $content.getProperties().getStringProperty("checkbox") != "")
  #if($content.getProperties().getStringProperty("value") && $content.getProperties().getStringProperty("value") != "")
    #set ($value = $content.getProperties().getStringProperty("value"))
  #else
    #set ($value = "")
  #end
  $props.setStringProperty($content, $props.getStringProperty("checkbox"), $value)
#end

#if ($body != "")
  <form class="aui" id="dynCheckboxForm">
  #foreach($box in $body.split(","))
    #if($content.getProperties().getStringProperty($content, "dynCheckbox$box") == "checked")
      #set($checked = 'checked="checked"')
    #else
      #set($checked = '')
    #end
    <div class="checkbox">
    <input class="checkbox dynCheckbox" type="checkbox" name="dynCheckbox$box" id="dynCheckbox$box" $checked value="checked" />
    <label for="dynCheckbox$box">$box</label>
  </div> 
  <script type="text/javascript">
    AJS.toInit(function(){
      AJS.$('.dynCheckbox$box').click(function(){
        AJS.${d}.ajax({
          type: 'GET',
            data: {
              submit: 'true',
              checkbox: AJS.$(this).attr('id'),
              value: AJS.$(this).is(':checked') ? 'checked' : ''
            },
            url: "$content.getUrlPath()",
            success: function(data) {
              console.log(data);
            },
            error: function() {
              console.log(data);
            }
          });
        });
      });
    </script>
  #end
  </form>
#end

 

Rafer Gluyas

I've been having a go with this, have made some progress: 

 

First off, there was an issue with 

 AJS.$('.dynCheckbox$box').click(.....

which has now been replaced with (also simplified naming while I was in there)

 #set($uiComponent="dynCheckbox$box")
...
...
 AJS.$('#$uiComponent').click(...

And there was an issue around using AJS.${d}, which has been replaced with the use of a variable to be set with the stored value:

#set($D='$')
...
...
             AJS.${D}.ajax({

 

 

## @noparams

#set($D='$')
#set($props = $content.getProperties() )
#if($content.getProperties().getStringProperty("submit") == "true" && $content.getProperties().getStringProperty("checkbox") && $content.getProperties().getStringProperty("checkbox") != "")
  #if($content.getProperties().getStringProperty("value") && $content.getProperties().getStringProperty("value") != "")
    #set ($value = $content.getProperties().getStringProperty("value"))
  #else
    #set ($value = "")
  #end
  $props.setStringProperty($content, $props.getStringProperty("checkbox"), $value)
#end

#if ($body != "")
  <form class="aui" id="dynCheckboxForm">
  #foreach($box in $body.split(","))
    #set($uiComponent="dynCheckbox$box")
    #if($content.getProperties().getStringProperty($content,$uiComponent) == "checked")
      #set($checked = 'checked="checked"')
    #else
      #set($checked = '')
    #end
    <div class="checkbox">
      <input class="checkbox dynCheckbox" type="checkbox" name="$uiComponent" id="$uiComponent" $checked value="checked" />
      <label for="$uiComponent">$box</label>
    </div> 
    <script type="text/javascript">
      AJS.toInit(function(){
      AJS.$('#$uiComponent').click(function(){
        AJS.${D}.ajax({
          type: 'GET',
          data: {
            submit: 'true',
            checkbox: AJS.$(this).attr('id'),
            value: AJS.$(this).is(':checked') ? 'checked' : ''
          },
            url: "$content.getUrlPath()",
            success: function(data) {
              console.log(data);
            },
            error: function() {
              console.log(data);
            }
          });
        });
      });
    </script>
  #end
  </form>
#end

 

Even with those changes, there is still an issue in the setting of the value - its not getting into the underlying model, which means no storage across refreshes of the page. So this still isn't fixed, even if it does work better