Fixed #16371 -- Added a prefix "field-" to all CSS class names automatically generated from field names in admin forms to avoid conflicts with other common class names (e.g. "button"). This is backwards-incompatible for those who previously used plain field names as selector in custom style sheets or javascript transformations.

git-svn-id: http://code.djangoproject.com/svn/django/trunk@16953 bcc190cf-cafb-0310-a4f2-bffc1f526a37

django/contrib/admin/templates/admin/edit_inline/tabular.html

@@ -44,7 +44,7 @@
         {% for fieldset in inline_admin_form %}
           {% for line in fieldset %}
             {% for field in line %}
-              <td class="{{ field.field.name }}">
+              <td{% if field.field.name %} class="field-{{ field.field.name }}"{% endif %}>
               {% if field.is_readonly %}
                   <p>{{ field.contents }}</p>
               {% else %}

django/contrib/admin/templates/admin/includes/fieldset.html

@@ -4,7 +4,7 @@
         <div class="description">{{ fieldset.description|safe }}</div>
     {% endif %}
     {% for line in fieldset %}
-        <div class="form-row{% if line.fields|length_is:'1' and line.errors %} errors{% endif %}{% for field in line %} {{ field.field.name }}{% endfor %}">
+        <div class="form-row{% if line.fields|length_is:'1' and line.errors %} errors{% endif %}{% for field in line %}{% if field.field.name %} field-{{ field.field.name }}{% endif %}{% endfor %}">
             {% if line.fields|length_is:'1' %}{{ line.errors }}{% endif %}
             {% for field in line %}
                 <div{% if not line.fields|length_is:'1' %} class="field-box{% if not field.is_readonly and field.errors %} errors{% endif %}"{% endif %}>

docs/releases/1.4.txt

@@ -431,6 +431,16 @@ files were removed and grouped into two sprite files, respectively:
 those icons to customize the admin then you will want to replace them with your
 own icons or retrieve them from a previous release.
 
+CSS class names in admin forms
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+To avoid conflicts with other common CSS class names (e.g. "button"), a prefix
+"field-" has been added to all CSS class names automatically generated from the
+form field names in the main admin forms, stacked inline forms and tabular
+inline cells. You will need to take that prefix into account in your custom
+style sheets or javascript files if you previously used plain field names as
+selectors for custom styles or javascript transformations.
+
 Compatibility with old signed data
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 

tests/regressiontests/admin_views/tests.py

@@ -2786,11 +2786,11 @@ class ReadonlyTest(TestCase):
             formats.localize(datetime.date.today() - datetime.timedelta(days=7))
         )
 
-        self.assertContains(response, '<div class="form-row coolness">')
+        self.assertContains(response, '<div class="form-row field-coolness">')
-        self.assertContains(response, '<div class="form-row awesomeness_level">')
+        self.assertContains(response, '<div class="form-row field-awesomeness_level">')
-        self.assertContains(response, '<div class="form-row posted">')
+        self.assertContains(response, '<div class="form-row field-posted">')
-        self.assertContains(response, '<div class="form-row value">')
+        self.assertContains(response, '<div class="form-row field-value">')
-        self.assertContains(response, '<div class="form-row ">')
+        self.assertContains(response, '<div class="form-row">')
         self.assertContains(response, '<p class="help">', 3)
         self.assertContains(response, '<p class="help">Some help text for the title (with unicode ŠĐĆŽćžšđ)</p>')
         self.assertContains(response, '<p class="help">Some help text for the content (with unicode ŠĐĆŽćžšđ)</p>')
@@ -2983,6 +2983,33 @@ class GroupAdminTest(TestCase):
             self.assertEqual(response.status_code, 200)
 
 
+class CSSTest(TestCase):
+    urls = "regressiontests.admin_views.urls"
+    fixtures = ['admin-views-users.xml']
+
+    def setUp(self):
+        self.client.login(username='super', password='secret')
+
+    def tearDown(self):
+        self.client.logout()
+
+    def test_css_classes(self):
+        response = self.client.get('/test_admin/admin/admin_views/post/add/')
+
+        # The main form
+        self.assertContains(response, 'class="form-row field-title"')
+        self.assertContains(response, 'class="form-row field-content"')
+        self.assertContains(response, 'class="form-row field-public"')
+        self.assertContains(response, 'class="form-row field-awesomeness_level"')
+        self.assertContains(response, 'class="form-row field-coolness"')
+        self.assertContains(response, 'class="form-row field-value"')
+        self.assertContains(response, 'class="form-row"') # The lambda function
+
+        # The tabular inline
+        self.assertContains(response, '<td class="field-url">')
+        self.assertContains(response, '<td class="field-posted">')
+
+
 try:
     import docutils
 except ImportError: