Index: branches/5.2.x/core/admin_templates/js/grid_filters.js
===================================================================
--- branches/5.2.x/core/admin_templates/js/grid_filters.js (revision 16551)
+++ branches/5.2.x/core/admin_templates/js/grid_filters.js (revision 16552)
@@ -1,153 +1,165 @@
/*
Class used to convert <select multiple="multiple" ...> into div with checkboxes for each option
The select is hidden, but the data is still submitted through hidden control. This class is used for multioptions filter.
Basic usage:
<script type="text/javascript">
MultiOptions.ConvertSelect('hidden_id');
</script>
* @TODO: Make the Search/Close buttons optional.
* This will make the class flexible and it could be used for other purposes also.
*/
function MultiOptions() {}
MultiOptions.Selectors = [];
MultiOptions.ConvertSelect = function($id, $ajax) {
// custom_filters[partner-service][Default][Status][multioptions]
$id.match(/custom_filters\[(.*?)\]\[(.*?)\]\[.*?\]\[.*?\]/);
var $prefix = RegExp.$1;
var $grid_name = RegExp.$2;
var $select = $('#' + jq($id) + '_select');
if (!$select.length) {
return ;
}
// hide <select> element
$select.hide();
// create div with checkboxes and buttons
var $cur_index = MultiOptions.Selectors.length;
var $div = $('<div id="' + $id + '_div" class="multioptions_filter"></div>');
MultiOptions.Selectors.push($id);
// set defaults for missing phrases
if (!phrases['la_btn_SelectAll']) phrases['la_SelectAll'] = 'Select All';
if (!phrases['la_btn_OpenMultiFilter']) phrases['la_OpenMultiFilter'] = 'Open Filter';
if (!phrases['la_btn_Search']) phrases['la_ToolTip_Search'] = 'Search';
if (!phrases['la_btn_Close']) phrases['la_tooltip_close'] = 'Close';
// create div with checkboxes
var $options_div = $('<div></div>');
// add "Select All" checkbox
$options_div.append(
'<input type="checkbox" id="_mutlioptions_cb_' + $cur_index + '_all"/>\
<label for="_mutlioptions_cb_' + $cur_index + '_all">' + phrases['la_SelectAll'] + '</label><br/>'
);
var $options = $('option', $select);
// add each <select> option as checkbox to above div
$options.each(
function () {
var $checked = this.selected ? ' checked="checked"' : '';
$options_div.append(
'<input type="checkbox" class="_mutlioptions_cb_' + $cur_index + '" id="_mutlioptions_cb_' + $cur_index + '_' + this.value + '"' + $checked + ' value="' + this.value + '"/>\
<label for="_mutlioptions_cb_' + $cur_index + '_' + this.value + '">' + this.text + '</label><br/>'
);
}
);
// add buttons to search or close filter
$div
.append($options_div)
.append(
'<div style="margin-top: 7px; text-align: center">\
<input type="button" class="button" value="' + phrases['la_ToolTip_Search'] + '" onclick="search(\'' + $prefix + '\', \'' + $grid_name + '\', ' + parseInt($ajax) + ')"/> \
<input type="button" class="button" value="' + phrases['la_tooltip_close'] + '" onclick="MultiOptions.CloseSelector(' + $cur_index + ')">\
</div>'
);
$('#' + jq($form_name)).append($div);
// set click handlers
- $('#_mutlioptions_cb_' + $cur_index + '_all')
- .click(
- function ($e) {
- MultiOptions.SelectAll($cur_index);
- }
- )
- .prop('checked', $options.length == $options.filter(':selected').length);
+ var $select_all = $('#_mutlioptions_cb_' + $cur_index + '_all'),
+ $new_checked = $options.length === $options.filter(':selected').length;
+
+ $select_all.click(function ($e) {
+ MultiOptions.SelectAll($cur_index);
+ });
+
+ if ( $select_all.prop('checked') !== $new_checked ) {
+ $select_all.prop('checked', $new_checked).change();
+ }
$('input._mutlioptions_cb_' + $cur_index).click(
function ($e) {
MultiOptions.ItemChecked($cur_index);
}
);
// add filter placeholder, used for filter opening filter
var $filter = $('<div class="filter" style="cursor: pointer;">' + phrases['la_OpenMultiFilter'] + '</div>');
if ($select.hasClass('filter-active')) {
$filter.addClass('filter-active');
}
$filter
.click(
function($e) {
var $offset = $(this).offset();
var $box_left = $offset.left;
$('#' + jq($id) + '_div').css( {left: 0, top: $offset.top} ).show();
var $box_width = $('#' + jq($id) + '_div').outerWidth();
if ($box_left + $box_width > document.body.offsetWidth) {
// move left
$box_left -= $box_width;
}
$('#' + jq($id) + '_div').css('left', $box_left);
}
)
.insertAfter($select);
}
MultiOptions.CloseSelector = function(selector_index) {
$('#' + jq(MultiOptions.Selectors[selector_index]) + '_div').hide();
}
MultiOptions.ItemChecked = function(selector_index) {
// sync hidden field
var $reg_exp = new RegExp('^_mutlioptions_cb_' + selector_index + '_(?!all)([0-9A-Za-z-]+)');
update_checkbox_options($reg_exp, MultiOptions.Selectors[selector_index]);
// update "Select All" checkbox
var $select_all = $('#_mutlioptions_cb_' + selector_index + '_all');
var $options = $("input[type='checkbox']", '#' + jq(MultiOptions.Selectors[selector_index]) + '_div').not($select_all);
+ var $new_checked = $options.length === $options.filter(':checked').length;
- $select_all.prop('checked', $options.length == $options.filter(':checked').length);
+ if ( $select_all.prop('checked') !== $new_checked ) {
+ $select_all.prop('checked', $new_checked).change();
+ }
}
MultiOptions.SelectAll = function(selector_index) {
// set all checkbox to match "Select All" checkbox
var $select_all = $('#_mutlioptions_cb_' + selector_index + '_all');
var $checked = $select_all.prop('checked');
- $("input[type='checkbox']", '#' + jq(MultiOptions.Selectors[selector_index]) + '_div').not($select_all).prop('checked', $checked);
+ $("input[type='checkbox']", '#' + jq(MultiOptions.Selectors[selector_index]) + '_div').not($select_all).each(function () {
+ var $checkbox = $(this);
+
+ if ( $checkbox.prop('checked') !== $checked ) {
+ $checkbox.prop('checked', $checked).change();
+ }
+ });
// sync hidden field
var $reg_exp = new RegExp('^_mutlioptions_cb_' + selector_index + '_(?!all)([0-9A-Za-z-]+)');
update_checkbox_options($reg_exp, MultiOptions.Selectors[selector_index]);
}
Index: branches/5.2.x/core/admin_templates/groups/groups_edit_permissions.tpl
===================================================================
--- branches/5.2.x/core/admin_templates/groups/groups_edit_permissions.tpl (revision 16551)
+++ branches/5.2.x/core/admin_templates/groups/groups_edit_permissions.tpl (revision 16552)
@@ -1,140 +1,141 @@
<inp2:adm_SetPopupSize width="750" height="761"/>
<inp2:m_include t="incs/header"/>
<inp2:m_RenderElement name="combined_header" section="in-portal:user_groups" permission_type="advanced:manage_permissions" prefix="g" title_preset="groups_edit_permissions" tab_preset="Default"/>
<!-- ToolBar -->
<table class="toolbar" height="30" cellspacing="0" cellpadding="0" width="100%" border="0">
<tbody>
<tr>
<td>
<script type="text/javascript">
a_toolbar = new ToolBar();
a_toolbar.AddButton( new ToolBarButton('select', '<inp2:m_phrase label="la_ToolTip_Save" escape="1"/>', function() {
submit_event('g','<inp2:g_SaveEvent/>');
}
) );
a_toolbar.AddButton( new ToolBarButton('cancel', '<inp2:m_phrase label="la_ToolTip_Cancel" escape="1"/>', function() {
submit_event('g','OnCancelEdit');
}
) );
a_toolbar.AddButton( new ToolBarSeparator('sep1') );
a_toolbar.AddButton( new ToolBarButton('prev', '<inp2:m_phrase label="la_ToolTip_Prev" escape="1"/>', function() {
go_to_id('g', '<inp2:g_PrevId/>');
}
) );
a_toolbar.AddButton( new ToolBarButton('next', '<inp2:m_phrase label="la_ToolTip_Next" escape="1"/>', function() {
go_to_id('g', '<inp2:g_NextId/>');
}
) );
a_toolbar.Render();
<inp2:m_if check="g_IsSingle" >
a_toolbar.HideButton('prev');
a_toolbar.HideButton('next');
a_toolbar.HideButton('sep1');
<inp2:m_else/>
<inp2:m_if check="g_IsLast" >
a_toolbar.DisableButton('next');
</inp2:m_if>
<inp2:m_if check="g_IsFirst" >
a_toolbar.DisableButton('prev');
</inp2:m_if>
</inp2:m_if>
</script>
</td>
</tr>
</tbody>
</table>
<inp2:g_SaveWarning name="grid_save_warning"/>
<inp2:m_DefineElement name="permission_element" prefix="g-perm" onclick="">
<td>
<inp2:m_if check="{$prefix}_HasPermission" perm_name="$perm_name" section_name="$section_name">
<input type="hidden" id="<inp2:m_param name="prefix"/>[<inp2:m_param name="section_name"/>][<inp2:m_param name="perm_name"/>]" name="<inp2:m_param name="prefix"/>[<inp2:m_param name="section_name"/>][<inp2:m_param name="perm_name"/>]" value="<inp2:{$prefix}_PermissionValue section_name="$section_name" perm_name="$perm_name"/>">
<input type="checkbox" align="absmiddle" id="_cb_<inp2:m_param name="prefix"/>[<inp2:m_param name="section_name"/>][<inp2:m_param name="perm_name"/>]" name="_cb_<inp2:m_param name="prefix"/>[<inp2:m_param name="section_name"/>][<inp2:m_param name="perm_name"/>]" <inp2:m_if check="{$prefix}_PermissionValue" section_name="$section_name" perm_name="$perm_name" value="1">checked</inp2:m_if> onchange="update_checkbox(this, document.getElementById('<inp2:m_param name="prefix"/>[<inp2:m_param name="section_name"/>][<inp2:m_param name="perm_name"/>]'));" onclick="<inp2:m_param name="onclick"/>">
<inp2:m_else/>
</inp2:m_if>
</td>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="tree_element">
<tr class="<inp2:m_odd_even odd="table-color1" even="table-color2"/>">
<td>
<img src="img/spacer.gif" height="1" width="<inp2:g-perm_LevelIndicator level="$deep_level" multiply="20"/>" alt="" border="0"/>
<img src="<inp2:$SectionPrefix_ModulePath module="$icon_module"/>img/icons/icon24_<inp2:m_param name="icon"/>.png" border="0" alt="" title="" align="absmiddle"/>
<inp2:m_if check="m_ParamEquals" name="children_count" value="0">
<inp2:m_phrase name="$label"/>
<inp2:m_else/>
<inp2:m_if check="m_ParamEquals" name="section_name" value="in-portal:root">
<b><inp2:m_param name="label"/></b>
<inp2:m_else/>
<b><inp2:m_phrase name="$label"/></b>
</inp2:m_if>
</inp2:m_if>
<inp2:m_if check="m_IsDebugMode">
<br />
<img src="img/spacer.gif" height="1" width="<inp2:g-perm_LevelIndicator level="$deep_level" multiply="20"/>" alt="" border="0"/>
<small style="color: gray;">[<inp2:m_param name="section_name"/>, <b><inp2:m_param name="SectionPrefix"/></b>]</small>
</inp2:m_if>
</td>
<inp2:m_RenderElement name="permission_element" section_name="$section_name" perm_name="view" onclick="update_perm_checkboxes(this);"/>
<inp2:m_RenderElement name="permission_element" section_name="$section_name" perm_name="add"/>
<inp2:m_RenderElement name="permission_element" section_name="$section_name" perm_name="edit"/>
<inp2:m_RenderElement name="permission_element" section_name="$section_name" perm_name="delete"/>
<td>
<inp2:m_if check="g-perm_HasAdvancedPermissions" section_name="$section_name">
<a href="<inp2:m_t t='groups/permissions_selector' pass='all,g-perm' section_name='$section_name'/>" onclick="openSelector('g-perm', this.href, 'PermList', null, 'OnGroupSavePermissions'); return false;"><inp2:m_phrase name="la_btn_Change"/></a>
<inp2:m_else/>
</inp2:m_if>
</td>
</tr>
</inp2:m_DefineElement>
<inp2:g-perm_LoadPermissions/>
<div id="scroll_container">
<table class="edit-form">
<inp2:m_set g-perm_sequence="1" odd_even="table-color1"/>
<tr class="subsectiontitle">
<td><inp2:m_phrase label="la_col_PermissionName"/></td>
<td><inp2:m_phrase label="la_col_PermView"/></td>
<td><inp2:m_phrase label="la_col_PermAdd"/></td>
<td><inp2:m_phrase label="la_col_PermEdit"/></td>
<td><inp2:m_phrase label="la_col_PermDelete"/></td>
<td><inp2:m_phrase label="la_col_AdditionalPermissions"/></td>
</tr>
<inp2:adm_DrawTree render_as="tree_element" section_name="in-portal:root"/>
</table>
</div>
<script type="text/javascript">
function update_perm_checkboxes($source_perm)
{
var $permissions = ['add', 'edit', 'delete'];
var $rets = $source_perm.id.match(/_cb_g-perm\[(.*)\]\[(.*)\]/);
var $test_perm = '';
var $i = 0;
while($i < $permissions.length) {
$test_perm = '_cb_g-perm[' + $rets[1] + '][' + $permissions[$i] + ']';
$test_perm = document.getElementById($test_perm);
- if ($test_perm) {
- $test_perm.checked = $source_perm.checked;
- update_checkbox($test_perm, document.getElementById('g-perm[' + $rets[1] + '][' + $permissions[$i] + ']'));
+
+ if ( $test_perm && $test_perm.checked !== $source_perm.checked ) {
+ $($test_perm).prop('checked', $source_perm.checked).change();
}
+
$i++;
}
}
</script>
-<inp2:m_include t="incs/footer"/>
\ No newline at end of file
+<inp2:m_include t="incs/footer"/>