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: (function(){ SelectFilter.move("'+ field_id + '", "'+ field_id + '_from", "' + field_id + '_to");})()', '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: (function(){ SelectFilter.move("'+ field_id + '", "' + field_id + '_to", "' + field_id + '_from");})()', 'id', field_id + '_remove_link');
remove_link.className = 'selector-remove';
//
@@ -75,25 +95,25 @@ window.SelectFilter = {
var title_chosen = quickElement('h2', selector_chosen, interpolate(gettext('Chosen %s') + ' ', [field_name]));
quickElement('img', title_chosen, '', 'src', admin_media_prefix + 'img/icon-unknown.gif', 'width', '10', 'height', '10', 'class', 'help help-tooltip', 'title', interpolate(gettext('This is the list of chosen %s. You may remove some by selecting them in the box below and then clicking the "Remove" arrow between the two boxes.'), [field_name]));
- var to_box = quickElement('select', selector_chosen, '', 'id', field_id + '_to', 'multiple', 'multiple', 'size', from_box.size, 'name', from_box.getAttribute('name'));
+ var to_box = quickElement('select', selector_chosen, '', 'id', field_id + '_to', 'multiple', 'multiple', 'size', from_box.size, 'name', actual_box.attr('name') + '_to');
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: (function() { SelectFilter.move("'+ field_id + '", "' + field_id + '_to", "' + field_id + '_from", true);})()', '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(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); });
- addEvent(from_box, 'change', function(e) { SelectFilter.refresh_icons(field_id) });
- addEvent(to_box, 'change', function(e) { SelectFilter.refresh_icons(field_id) });
- addEvent(from_box, 'dblclick', function() { SelectBox.move(field_id + '_from', field_id + '_to'); SelectFilter.refresh_icons(field_id); });
- addEvent(to_box, 'dblclick', function() { SelectBox.move(field_id + '_to', field_id + '_from'); SelectFilter.refresh_icons(field_id); });
- addEvent(findForm(from_box), 'submit', function() { SelectBox.select_all(field_id + '_to'); });
- SelectBox.init(field_id + '_from');
- SelectBox.init(field_id + '_to');
- // Move selected from_box options to to_box
- SelectBox.move(field_id + '_from', field_id + '_to');
+ addEvent(from_box, 'change', function(e) { SelectFilter.refresh_state(field_id) });
+ addEvent(to_box, 'change', function(e) { SelectFilter.refresh_state(field_id) });
+ addEvent(from_box, 'dblclick', function() {
+ SelectFilter.move(field_id, field_id + '_from', field_id + '_to');
+ });
+ addEvent(to_box, 'dblclick', function() {
+ SelectFilter.move(field_id, field_id + '_to', field_id + '_from');
+ });
+
+ // Move selected from from_box options to to_box
+ SelectFilter.move(field_id, field_id + '_from', field_id + '_to');
if (!is_stacked) {
// In horizontal mode, give the same height to the two boxes.
@@ -109,7 +129,20 @@ window.SelectFilter = {
}
// Initial icon refresh
- SelectFilter.refresh_icons(field_id);
+ SelectFilter.refresh_state(field_id);
+ },
+ move: function(field_id, from_id, to_id, all) {
+ var options;
+ var from_box = $('#' + from_id);
+ var to_box = $('#' + to_id);
+ options = from_box.find("option");
+ if (!all) {
+ options = options.filter(':selected');
+ }
+ to_box.append(options);
+ to_box.find('option').removeAttr('selected');
+
+ SelectFilter.refresh_state(field_id);
},
refresh_icons: function(field_id) {
var from = $('#' + field_id + '_from');
@@ -123,36 +156,54 @@ window.SelectFilter = {
$('#' + field_id + '_add_all_link').toggleClass('active', from.find('option').length > 0);
$('#' + field_id + '_remove_all_link').toggleClass('active', to.find('option').length > 0);
},
+ refresh_state: function(field_id) {
+ SelectFilter.refresh_icons(field_id);
+
+ // Re-generate the content of the actual, hidden, box.
+ var actual_box = $('#' + field_id);
+ var actual_options = actual_box.find('option');
+ var to_box = $('#' + field_id + '_to');
+
+ // De-select all options.
+ actual_box.find('option').removeAttr('selected', 'selected');
+
+ // Select all the same options as those from the 'to' box.
+ to_box.find('option').each(function(){
+ var option = actual_options[$(this).data('index')];
+ $(option).attr('selected', 'selected');
+ });
+ },
filter_key_up: function(event, field_id) {
- var from = document.getElementById(field_id + '_from');
+ var from_box = document.getElementById(field_id + '_from');
// don't submit form if user pressed Enter
if ((event.which && event.which == 13) || (event.keyCode && event.keyCode == 13)) {
- from.selectedIndex = 0;
- SelectBox.move(field_id + '_from', field_id + '_to');
- from.selectedIndex = 0;
+ from_box.selectedIndex = 0;
+ SelectFilter.move(field_id, field_id + '_from', field_id + '_to');
+ from_box.selectedIndex = 0;
return false;
}
- var temp = from.selectedIndex;
- SelectBox.filter(field_id + '_from', document.getElementById(field_id + '_input').value);
- from.selectedIndex = temp;
+ var temp = from_box.selectedIndex;
+// FIXME!
+// SelectBox.filter(field_id + '_from', document.getElementById(field_id + '_input').value);
+ from_box.selectedIndex = temp;
return true;
},
filter_key_down: function(event, field_id) {
- var from = document.getElementById(field_id + '_from');
+ var from_box = document.getElementById(field_id + '_from');
// right arrow -- move across
if ((event.which && event.which == 39) || (event.keyCode && event.keyCode == 39)) {
- var old_index = from.selectedIndex;
- SelectBox.move(field_id + '_from', field_id + '_to');
- from.selectedIndex = (old_index == from.length) ? from.length - 1 : old_index;
+ var old_index = from_box.selectedIndex;
+ SelectFilter.move(field_id, field_id + '_from', field_id + '_to');
+ from_box.selectedIndex = (old_index == from_box.length) ? from_box.length - 1 : old_index;
return false;
}
// down arrow -- wrap around
if ((event.which && event.which == 40) || (event.keyCode && event.keyCode == 40)) {
- from.selectedIndex = (from.length == from.selectedIndex + 1) ? 0 : from.selectedIndex + 1;
+ from_box.selectedIndex = (from_box.length == from_box.selectedIndex + 1) ? 0 : from_box.selectedIndex + 1;
}
// up arrow -- wrap around
if ((event.which && event.which == 38) || (event.keyCode && event.keyCode == 38)) {
- from.selectedIndex = (from.selectedIndex == 0) ? from.length - 1 : from.selectedIndex - 1;
+ from_box.selectedIndex = (from_box.selectedIndex == 0) ? from_box.length - 1 : from_box.selectedIndex - 1;
}
return true;
}
diff --git a/django/contrib/auth/admin.py b/django/contrib/auth/admin.py
index f14b3d2..9d68ed8 100644
--- a/django/contrib/auth/admin.py
+++ b/django/contrib/auth/admin.py
@@ -21,7 +21,7 @@ csrf_protect_m = method_decorator(csrf_protect)
class GroupAdmin(admin.ModelAdmin):
search_fields = ('name',)
ordering = ('name',)
- filter_horizontal = ('permissions',)
+ filter_vertical = ('permissions',)
def formfield_for_manytomany(self, db_field, request=None, **kwargs):
if db_field.name == 'permissions':
diff --git a/tests/regressiontests/admin_widgets/tests.py b/tests/regressiontests/admin_widgets/tests.py
index b0b3209..f0d948e 100644
--- a/tests/regressiontests/admin_widgets/tests.py
+++ b/tests/regressiontests/admin_widgets/tests.py
@@ -478,6 +478,9 @@ class HorizontalVerticalFilterSeleniumFirefoxTests(AdminSeleniumWebDriverTestCas
self.cliff = models.Student.objects.create(name='Cliff')
self.arthur = models.Student.objects.create(name='Arthur')
self.school = models.School.objects.create(name='School of Awesome')
+ self.school.students = [self.lisa, self.peter]
+ self.school.alumni = [self.lisa, self.peter]
+ self.school.save()
super(HorizontalVerticalFilterSeleniumFirefoxTests, self).setUp()
def execute_basic_operations(self, field_name, mode):
@@ -505,6 +508,7 @@ class HorizontalVerticalFilterSeleniumFirefoxTests(AdminSeleniumWebDriverTestCas
for option in self.selenium.find_elements_by_css_selector(from_box + ' option'):
option.click()
self.selenium.find_element_by_id(choose_link).click()
+
self.assertSelectOptions(from_box, [])
self.assertSelectOptions(to_box,
[str(self.lisa.id), str(self.peter.id),
@@ -567,16 +571,50 @@ class HorizontalVerticalFilterSeleniumFirefoxTests(AdminSeleniumWebDriverTestCas
str(self.arthur.id), str(self.cliff.id)])
def test_basic(self):
- self.school.students = [self.lisa, self.peter]
- self.school.alumni = [self.lisa, self.peter]
- self.school.save()
+ self.admin_login(username='super', password='secret', login_url='/')
+ self.selenium.get(
+ '%s%s' % (self.live_server_url, '/admin_widgets/school/%s/' % self.school.id))
+ self.execute_basic_operations('students', 'vertical')
+ self.execute_basic_operations('alumni', 'horizontal')
+
+ # Save and check that everything is properly stored in the database ---
+ self.selenium.find_element_by_xpath('//input[@value="Save"]').click()
+ self.school = models.School.objects.get(id=self.school.id) # Reload from database
+ self.assertEqual(list(self.school.students.all()),
+ [self.arthur, self.cliff, self.jason, self.john])
+ self.assertEqual(list(self.school.alumni.all()),
+ [self.arthur, self.cliff, self.jason, self.john])
+
+ def test_webkit_bug_13614(self):
self.admin_login(username='super', password='secret', login_url='/')
self.selenium.get(
'%s%s' % (self.live_server_url, '/admin_widgets/school/%s/' % self.school.id))
self.execute_basic_operations('students', 'vertical')
self.execute_basic_operations('alumni', 'horizontal')
+ # Navigate away and go back to the change form page -------------------
+ self.selenium.find_element_by_link_text('Home').click()
+ self.selenium.back()
+
+ # Check that everything is still in place -----------------------------
+ from_box = '#id_students_from'
+ to_box = '#id_students_to'
+ self.assertSelectOptions(from_box,
+ [str(self.bob.id), str(self.jenny.id),
+ str(self.lisa.id), str(self.peter.id)])
+ self.assertSelectOptions(to_box,
+ [str(self.arthur.id), str(self.cliff.id),
+ str(self.jason.id), str(self.john.id)])
+
+ from_box = '#id_alumni_from'
+ to_box = '#id_alumni_to'
+ self.assertSelectOptions(from_box,
+ [str(self.bob.id), str(self.jenny.id),
+ str(self.lisa.id), str(self.peter.id)])
+ self.assertSelectOptions(to_box,
+ [str(self.arthur.id), str(self.cliff.id),
+ str(self.jason.id), str(self.john.id)])
# Save and check that everything is properly stored in the database ---
self.selenium.find_element_by_xpath('//input[@value="Save"]').click()