markwheeler

In the previous post, I had to populate a list lookup control that was filtered by cascading drop-downs. The second task was to default all the training classes as selected.

One option is to add a user-selectable Yes/No button to select all the tasks. In my form, the data is contained in a Repeater Row control. Having a Select All button in multiple repeater rows would cause a conflict between several rows as the script action is not unique. I’m including this here for reference.

Assign a Javascript clientID to your Yes/No button.

Add the following lines to the Custom Javascript area on your form settings.

NWF$('#'+YOURJAVASCRIPTID).click(function(){   
NWF$('input:checkbox').not(this).prop('checked', this.checked);
});

If you want no user interaction and just want to select everything by default you can add the following to the Custom Javascript area on your form settings.

// Wait for the List Lookup to Render
NWF.FormFiller.Events.RegisterAfterReady(function(){
// We are looking for all checkboxes in the form.
var myElement = document.querySelectorAll('input[type=checkbox]')[0];
// Mutant Observer setup. This watches for dynamic changes to the DOM
var observer = new MutationObserver(function(mutations) {
// If there's a checkbox and it's not checked...
if (document.contains(myElement) && NWF$('input:checkbox').prop('checked', false)) {
// console.log("Checkbox Added"); 
// Check the box.
NWF$('input[type=checkbox]').trigger('click');
//count++
//console.log(count); 
}
});
// Observer kick off.
observer.observe(document, {attributes: false, childList: true, characterData: true, subtree:true});
});

A couple of things to note:
1. .trigger(‘click’); is the key here. You could use .prop(‘checked’, this.checked); But, this does NOT save the change state. Your form will be saved without any selections.
2. attributes: false, must be set. This could set off an infinite loop within the MutationObserver and the page will hang.
3. MutationObserver only works in modern browsers; Firefox, Chrome, MS Edge.