Commit fa9cb5dc authored by Rolf Jagerman's avatar Rolf Jagerman Committed by Tim Graham
Browse files

Fixed #24406 -- Improved SelectFilter js to use click events 

The SelectFilter widget used href to execute javascript. This was
problematic if one wishes to customize the widget, since the href
javascript is executed after events are handled. This change modifies
the javascript to use click events to handle button behavior.
parent 71820721

django/contrib/admin/static/admin/js/SelectFilter2.js

+8 −4
Original line number Diff line number Diff line
@@ -58,15 +58,15 @@ window.SelectFilter = { 
        filter_input.id = field_id + '_input';



        selector_available.appendChild(from_box);

        var choose_all = quickElement('a', selector_available, gettext('Choose all'), 'title', interpolate(gettext('Click to choose all %s at once.'), [field_name]), 'href', 'javascript: (function(){ SelectBox.move_all("' + field_id + '_from", "' + field_id + '_to"); SelectFilter.refresh_icons("' + field_id + '");})()', 'id', field_id + '_add_all_link');

        var choose_all = quickElement('a', selector_available, gettext('Choose all'), 'title', interpolate(gettext('Click to choose all %s at once.'), [field_name]), 'href', 'javascript:void(0);', 'id', field_id + '_add_all_link');

        choose_all.className = 'selector-chooseall';



        // <ul class="selector-chooser">

        var selector_chooser = quickElement('ul', selector_div);

        selector_chooser.className = 'selector-chooser';

        var add_link = quickElement('a', quickElement('li', selector_chooser), gettext('Choose'), 'title', gettext('Choose'), 'href', 'javascript: (function(){ SelectBox.move("' + field_id + '_from","' + field_id + '_to"); SelectFilter.refresh_icons("' + field_id + '");})()', 'id', field_id + '_add_link');

        var add_link = quickElement('a', quickElement('li', selector_chooser), gettext('Choose'), 'title', gettext('Choose'), 'href', 'javascript:void(0);', 'id', field_id + '_add_link');

        add_link.className = 'selector-add';

        var remove_link = quickElement('a', quickElement('li', selector_chooser), gettext('Remove'), 'title', gettext('Remove'), 'href', 'javascript: (function(){ SelectBox.move("' + field_id + '_to","' + field_id + '_from"); SelectFilter.refresh_icons("' + field_id + '");})()', 'id', field_id + '_remove_link');

        var remove_link = quickElement('a', quickElement('li', selector_chooser), gettext('Remove'), 'title', gettext('Remove'), 'href', 'javascript:void(0);', 'id', field_id + '_remove_link');

        remove_link.className = 'selector-remove';



        // <div class="selector-chosen">
@@ -77,12 +77,16 @@ window.SelectFilter = { 


        var to_box = quickElement('select', selector_chosen, '', 'id', field_id + '_to', 'multiple', 'multiple', 'size', from_box.size, 'name', from_box.getAttribute('name'));

        to_box.className = 'filtered';

        var clear_all = quickElement('a', selector_chosen, gettext('Remove all'), 'title', interpolate(gettext('Click to remove all chosen %s at once.'), [field_name]), 'href', 'javascript: (function() { SelectBox.move_all("' + field_id + '_to", "' + field_id + '_from"); SelectFilter.refresh_icons("' + field_id + '");})()', 'id', field_id + '_remove_all_link');

        var clear_all = quickElement('a', selector_chosen, gettext('Remove all'), 'title', interpolate(gettext('Click to remove all chosen %s at once.'), [field_name]), 'href', 'javascript:void(0);', 'id', field_id + '_remove_all_link');

        clear_all.className = 'selector-clearall';



        from_box.setAttribute('name', from_box.getAttribute('name') + '_old');



        // Set up the JavaScript event handlers for the select box filter interface

        addEvent(choose_all, 'click', function() { SelectBox.move_all(field_id + '_from', field_id + '_to'); SelectFilter.refresh_icons(field_id); });

        addEvent(add_link, 'click', function() { SelectBox.move(field_id + '_from', field_id + '_to'); SelectFilter.refresh_icons(field_id); });

        addEvent(remove_link, 'click', function() { SelectBox.move(field_id + '_to', field_id + '_from'); SelectFilter.refresh_icons(field_id); });

        addEvent(clear_all, 'click', function() { SelectBox.move_all(field_id + '_to', field_id + '_from'); SelectFilter.refresh_icons(field_id); });

        addEvent(filter_input, 'keypress', function(e) { SelectFilter.filter_key_press(e, field_id); });

        addEvent(filter_input, 'keyup', function(e) { SelectFilter.filter_key_up(e, field_id); });

        addEvent(filter_input, 'keydown', function(e) { SelectFilter.filter_key_down(e, field_id); });