#11195: add fieldname to admin changelist <td> tags -- eases CSS customization
----------------------------------+-----------------------------------------
Reporter: akaihola | Owner: nobody
Status: new | Milestone:
Component: django.contrib.admin | Version: SVN
Keywords: css | Stage: Unreviewed
Has_patch: 1 |
----------------------------------+-----------------------------------------
=== The Itch ===
Currently it's fairly difficult to customize the layout of individual
columns in the admin change list view. The `<td>` and `<th>` tags are
created programmatically, not using templates, and the existing set of
`id=` and `class=` attributes for cells and their contents don't help in
writing simple CSS selectors.
=== A way to scratch ===
The attached patch adds a "`fieldname_*`" class name for each cell of the
change list table. This enables simple CSS selectors to match columns by
field name.
=== Use case ===
A simple example of what this makes possible: Suppose that in order to
maximize the width of a text field we want to split a date field into two
rows. The "''Today | <calendar symbol>''" part should be rendered below
the date `TextInput`, not next to it to the right as usual.
A model:
{{{
class Poll(models.Model):
title = models.CharField(max_length=100)
question = models.CharField(max_length=200)
pub_date = models.DateField('date published')
}}}
The admin definition makes our fields editable in the change list:
{{{
class PollAdmin(admin.ModelAdmin):
list_display = 'title', 'question', 'pub_date',
list_editable = 'question', 'pub_date',
}}}
An "`admin/my_app/poll/change_list.html`" template for injecting CSS into
the change list:
{{{
{% extends "admin/change_list.html" %}
{% block extrastyle %}
{{ block.super }}
<link rel="stylesheet" type="text/css"
href="/css/poll_admin_changelist.css" />
{% endblock extrastyle %}
}}}
Custom CSS rules in "`MEDIA_ROOT/css/poll_admin_changelist.css`":
{{{
#changelist td.fieldname_question input { width: 50em; }
#changelist td.fieldname_pub_date span { display: block; }
}}}
Without the presented patch this is impossible using only clean and simple
CSS definitions since the "`fieldname_question`" and
"`fieldname_pub_date`" classes are missing.
=== Cons ===
A drawback is that the size of the HTML source for a change list page
grows by (19 + ''field name length'') bytes for every field, or (11 +
''field name length'') bytes for date/time fields.
=== Other ways to scratch this itch ===
For brevity, the class name could be formed from a short prefix and the
field index (e.g. `"f1"`, `"f2"` etc., basically the column number).
However, this would break the CSS every time the set of fields is changed.
Another possible approach would be to modify the `{% result_list %}`
inclusion tag (or, more specifically, the
`django.contrib.admin.templatetags.admin_list.items_for_result()`
function) to render each cell using an overridable template.
Or, `{% result_list %}` could replace the "`results`" list of strings in
its context with a list of dicts containing enough information about each
field. Cells would be rendered in the "`admin/change_list_results.html`"
template based on those dicts. Customizability would come with the expense
of part of the complexity moving from the template tag to the template.
--
Ticket URL: <http://code.djangoproject.com/ticket/11195>
Django <http://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Django updates" group.
To post to this group, send email to django-updates@googlegroups.com
To unsubscribe from this group, send email to
django-updates+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/django-updates?hl=en
-~----------~----~----~----~------~----~------~--~---
