listen to event based on met criteria

[LefterisKoumis]

I have a number of check boxes that users can click on to activate a layer on each checkbox. After a number of check boxes  clicked, I would like to capture the click event but not check the checkbox (stop any further actions), and inform the user that the max number of boxes is reached. If the user deselect a checkbox, then the functionality is restored again.

Suggestions? Thanks.

this.own(on(layerCheckbox.domNode, 'click', lang.hitch(this, function(){

   if (numberofcheckboxes >5) //criteria met

   {

    --------------

   } else {

})

[RobertScheitlin__GISP]

Lefteris,

   That is normally what you would use dojo on.pausable for:

https://dojotoolkit.org/reference-guide/1.10/dojo/on.html#pausable 

[LefterisKoumis]

Thank you Robert. However it is not to going to work for me. I modified my question because I realized that is not clear enough.

[RobertScheitlin__GISP]

Lefteris,

   I would suggest you not spend time on trying to prevent the check. I would handle this by just un-checking the checkbox if the max checkbox count has been meet.

[LefterisKoumis]

Yes, you are correct. It seems to be too complex to prevent the check. However, I tried this below and it has no effect on the checkbox. The checkbox remains checked after the user clicked on it. The script below is from the function called when the user clicked on the checkbox, however it does not deselect the checkbox. The checkbox id has been assigned the layer name. Console shows false and the layer name meaning that the checkbox is correctly identified. Any obvious errors? Thank you.

if (numberoflayers > 4){
alert("Sorry, no more layers than 5 layer can be selected. Please remove a layer before you can add another one.")
var thestatus = registry.byId(layer.name);
thestatus.set("checked", false);

console.log(thestatus.checked + " " + layer.name);
return;
} else {
this.addLayerToMap(layer);
}

[RobertScheitlin__GISP]

Lefteris,

   I have my checkboxes in my Widget.html file with data-dojo-attach-point property and use:

this.shareCbx.setValue(true);

if I want to check the checkbox

I tend to use the lightweight jimu/dijit/CheckBox though.

[LefterisKoumis]

Thanks. My checkboxes are constructed  during design time and it seems to be a bit more complex to programmatically check or uncheck the boxes.

[RobertScheitlin__GISP]

Lefteris,

  If they are created at design time then that would make it pretty simple.

Widget.html

<div data-dojo-type="jimu/dijit/CheckBox" data-dojo-attach-point="allowCSVExport"
    data-dojo-props="label:'${nls.allowcsvexport}'"/>‍‍

Widget.js

this.allowCSVExport.setValue(false);‍

[LefterisKoumis]

Sorry, I mispoke.

The html file is in the form shown below,  and in the js file I declare and create the checkboxes in each layerlist. I place each check box on a row in a table,  similar to the AddLayer widget. By the way, how can I post code on the forum with the numbering?

<div data-dojo-type="dijit/layout/TabContainer" style=" height: 700px; " >
<div data-dojo-type="dijit/layout/ContentPane" title="General Environmental" >
<div data-dojo-attach-point="layerListGenEnv"> </div>
</div>
<div data-dojo-type="dijit/layout/TabContainer" title="Biology" nested="true">
<div data-dojo-type="dijit/layout/ContentPane" title="Fish" data-dojo-props="selected:true" style="">
<div data-dojo-attach-point="layerListFish"> </div>
</div>
<div data-dojo-type="dijit/layout/ContentPane" title="Wildlife">
<div data-dojo-attach-point="layerListWildlife"> </div>
</div>
<div data-dojo-type="dijit/layout/ContentPane" title="Vegetation">
<div data-dojo-attach-point="layerListVegetation"> </div>
</div>
</div>

---------

--------

[RobertScheitlin__GISP]

Lefteris,

  So what does your Widget.js code look like for adding the checkboxes?

https://community.esri.com/people/curtvprice/blog/2014/09/25/posting-code-blocks-in-the-new-geonet