diff --git a/web/pgadmin/static/js/slickgrid/slick.pgadmin.editors.js b/web/pgadmin/static/js/slickgrid/slick.pgadmin.editors.js index 7522c4950..16454168c 100644 --- a/web/pgadmin/static/js/slickgrid/slick.pgadmin.editors.js +++ b/web/pgadmin/static/js/slickgrid/slick.pgadmin.editors.js @@ -709,14 +709,39 @@ } function ReadOnlyCheckboxEditor(args) { - var $select; + var $select, el; var defaultValue; var scope = this; this.init = function () { - $select = $(""); + $select = $(""); $select.appendTo(args.container); $select.focus(); + + // The following code is taken from https://css-tricks.com/indeterminate-checkboxes/ + $select.data('checked', 0).bind("click", function (e) { + el = $(this); + switch(el.data('checked')) { + // unchecked, going indeterminate + case 0: + el.data('checked', 1); + el.prop('indeterminate', true); + break; + + // indeterminate, going checked + case 1: + el.data('checked', 2); + el.prop('indeterminate', false); + el.prop('checked', true); + break; + + // checked, going unchecked + default: + el.data('checked', 0); + el.prop('indeterminate', false); + el.prop('checked', false); + } + }); }; this.destroy = function () { @@ -728,18 +753,31 @@ }; this.loadValue = function (item) { - defaultValue = !!item[args.column.field]; - if (defaultValue) { - $select.prop('checked', true); - } else { - $select.prop('checked', false); + defaultValue = item[args.column.field]; + if (_.isNull(defaultValue)) { + $select.prop('indeterminate', true); + } + else { + defaultValue = !!item[args.column.field]; + if (defaultValue) { + $select.prop('checked', true); + } else { + $select.prop('checked', false); + } } }; this.serializeValue = function () { + if ($select.prop('indeterminate')) { + return null; + } return $select.prop('checked'); }; + this.applyValue = function (item, state) { + item[args.column.field] = state; + }; + this.isValueChanged = function () { return (this.serializeValue() !== defaultValue); };