I want to add a css class to the headers in the django admin. For example I want my header of the field status
to be red. This is a more tricky task than I first imagined and I already have a (bad) solution:
I overwrite change_list_results.html
like so (two changes, one added line at the very beginning):
...
{% for header in result_headers %}
{% if header.text == "status" %}
<th scope="col" class="column-get_status TEST">
{% else %}
<th scope="col"{{ header.class_attrib }}>
{% endif %}
{% if header.sortable and header.sort_priority > 0 %}
...
i also added a css file in project/static/admin/css/base.css
:
.TEST {
color: red;
}
this works just fine but is far from scaleable.
digging into djangos code reveals admin_list.py
with result_headers()
. I had the idea to add a simple dictionary in my ModelAdmin
class:
class Foo(ModelAdmin):
list_display = ["get_status", ...]
css_styles = {"get_status": "TEST"} # <- new
def get_status(self):
return "bar"
modify it like this:
def result_headers(cl):
"""
Generate the list column headers.
"""
ordering_field_columns = cl.get_ordering_field_columns()
for i, field_name in enumerate(cl.list_display):
##### new code
try:
if field_name in cl.model_admin.css_styles.keys():
if isinstance(cl.model_admin.css_styles[field_name], str):
extra_css = cl.model_admin.css_styles[field_name]
elif isinstance(cl.model_admin.css_styles[field_name], list):
extra_css = " ".join(cl.model_admin.css_styles[field_name])
else:
raise Exception
except Exception:
extra_css = ""
######
text, attr = label_for_field(
field_name, cl.model, model_admin=cl.model_admin, return_attr=True
)
is_field_sortable = cl.sortable_by is None or field_name in cl.sortable_by
if attr:
field_name = _coerce_field_name(field_name, i)
# Potentially not sortable
# if the field is the action checkbox: no sorting and special class
if field_name == "action_checkbox":
yield {
"text": text,
"class_attrib": mark_safe(' class="action-checkbox-column"'),
"sortable": False,
}
continue
admin_order_field = getattr(attr, "admin_order_field", None)
# Set ordering for attr that is a property, if defined.
if isinstance(attr, property) and hasattr(attr, "fget"):
admin_order_field = getattr(attr.fget, "admin_order_field", None)
if not admin_order_field:
is_field_sortable = False
if not is_field_sortable:
# Not sortable
yield {
"text": text,
"class_attrib": format_html(f""" class="column-{field_name} {extra_css}" """) # <- changed,
"sortable": False,
}
continue
# OK, it is sortable if we got this far
th_classes = ["sortable", "column-{}".format(field_name), extra_css] # <- changed
order_type = ""
new_order_type = "asc"
sort_priority = 0
# Is it currently being sorted on?
is_sorted = i in ordering_field_columns
if is_sorted:
order_type = ordering_field_columns.get(i).lower()
sort_priority = list(ordering_field_columns).index(i) + 1
th_classes.append("sorted %sending" % order_type)
new_order_type = {"asc": "desc", "desc": "asc"}[order_type]
# build new ordering param
o_list_primary = [] # URL for making this field the primary sort
o_list_remove = [] # URL for removing this field from sort
o_list_toggle = [] # URL for toggling order type for this field
def make_qs_param(t, n):
return ("-" if t == "desc" else "") + str(n)
for j, ot in ordering_field_columns.items():
if j == i: # Same column
param = make_qs_param(new_order_type, j)
# We want clicking on this header to bring the ordering to the
# front
o_list_primary.insert(0, param)
o_list_toggle.append(param)
# o_list_remove - omit
else:
param = make_qs_param(ot, j)
o_list_primary.append(param)
o_list_toggle.append(param)
o_list_remove.append(param)
if i not in ordering_field_columns:
o_list_primary.insert(0, make_qs_param(new_order_type, i))
yield {
"text": text,
"sortable": True,
"sorted": is_sorted,
"ascending": order_type == "asc",
"sort_priority": sort_priority,
"url_primary": cl.get_query_string({ORDER_VAR: ".".join(o_list_primary)}),
"url_remove": cl.get_query_string({ORDER_VAR: ".".join(o_list_remove)}),
"url_toggle": cl.get_query_string({ORDER_VAR: ".".join(o_list_toggle)}),
"class_attrib": format_html(' class="{}"', " ".join(th_classes))
if th_classes
else "",
}
Where would I overwrite this function so I can use it the way I did to stay more flexible? Or is this a bad approach for some (which?) reason? How would this be done better?