mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-01-01 05:02:50 +08:00
Selected all checkboxes by default for result content adding modal and added disabling logic for dependent checkboxes. [fixes SCI-487]
This commit is contained in:
parent
901558c733
commit
79ec3b5e4c
2 changed files with 32 additions and 10 deletions
|
@ -215,12 +215,14 @@ function initializeNewElement(newEl) {
|
|||
id: parentElementId
|
||||
},
|
||||
success: function(data, status, jqxhr) {
|
||||
// Open modal, set its title
|
||||
// Open modal, set its title, and display module contents
|
||||
addContentsModal.find(".modal-title").text(modalTitle);
|
||||
|
||||
// Display module contents and add checkbox logic
|
||||
addContentsModalBody.html(data.html);
|
||||
addContentsModalBody.checkboxTreeLogic();
|
||||
|
||||
// Add logic for checkbox hierarchies
|
||||
var dependencies = { '_module_steps': $('#_step_all'),
|
||||
'_module_results': $('#_result_comments')}
|
||||
addContentsModalBody.checkboxTreeLogic(dependencies, true);
|
||||
|
||||
// Bind to the ajax events of the modal form in its body
|
||||
$(ADD_CONTENTS_FORM_ID)
|
||||
|
|
|
@ -186,11 +186,24 @@ function initPageTutorialSteps(pageFirstStepN, pageLastStepN, nextPagePath,
|
|||
}
|
||||
|
||||
/**
|
||||
* Checkbox on/off logic. Just add 'checkbox-tree' class to a 'div' surrounding
|
||||
* the checkboxes, represented with 'ul'.
|
||||
* Checkbox on/off logic. For each checkbox hierarchy add 'checkbox-tree' class
|
||||
* to a parent 'div' surrounding the checkbox hierarchy, represented with 'ul',
|
||||
* and apply this function to some ancestor tag.
|
||||
* @param {object} dependencies Hash of checkbox IDs (as keys), on whose
|
||||
* children and itself the corresponding checkbox object (as value) and its'
|
||||
* children depend on, BUT are in a seperate 'tree branch'
|
||||
* @param {boolean} checkAll Whether to check all the checkboxes by default,
|
||||
* otherwise leave them as is (the parameter can be left out)
|
||||
*/
|
||||
$.fn.checkboxTreeLogic = function() {
|
||||
$('.checkbox-tree input:checkbox').change(function() {
|
||||
$.fn.checkboxTreeLogic = function(dependencies, checkAll) {
|
||||
var $checkboxTree = $(this).find('.checkbox-tree').addBack('.checkbox-tree');
|
||||
var $checkboxTreeCheckboxes = $checkboxTree.find('input:checkbox');
|
||||
|
||||
if (checkAll) {
|
||||
$checkboxTreeCheckboxes.prop('checked', true);
|
||||
}
|
||||
|
||||
$checkboxTreeCheckboxes.change(function() {
|
||||
// Update descendent checkboxes
|
||||
var $checkbox = $(this);
|
||||
var checkboxChecked = $checkbox.prop('checked');
|
||||
|
@ -202,7 +215,7 @@ $.fn.checkboxTreeLogic = function() {
|
|||
// Update ancestor checkboxes
|
||||
// Loop until topmost checkbox is reached or until there's no parent
|
||||
// checkbox
|
||||
while ($checkbox.length !== 0 && !$checkbox.hasClass('checkbox-tree')) {
|
||||
while ($checkbox.length) {
|
||||
var $checkboxesContainer = $checkbox.closest('ul');
|
||||
var $parentCheckbox = $checkboxesContainer.siblings()
|
||||
.find('input:checkbox');
|
||||
|
@ -213,5 +226,12 @@ $.fn.checkboxTreeLogic = function() {
|
|||
$checkboxes.length === $checkedCheckboxes.length);
|
||||
$checkbox = $parentCheckbox;
|
||||
}
|
||||
});
|
||||
|
||||
// Disable/enable dependent checkboxes
|
||||
$.each(dependencies, function(k, $v) {
|
||||
var enable = $checkboxTree.find('#' + k).closest('li')
|
||||
.find('input:checkbox:checked').length
|
||||
$v.closest('li').find('input:checkbox').prop('disabled', !enable);
|
||||
});
|
||||
}).trigger('change');
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue