{% extends "admin/base_site.html" %} {% load i18n %} {% block bodyclass %}grp-doc{% endblock %} {% block content-class %}{% endblock %} {% block title %}Grappelli Documentation » Filter{% endblock %} {% block extrahead %} {% endblock %} {% block breadcrumbs %}
A filter is meant to appear in a .grp-row within a .grp-module.
Basically it is a .grp-filter containing an .grp-pulldown-container width an a.grp-button.grp-pulldown-handler and an ul.grp-pulldown-content.
Each li contains a label with the title of the actual filter and a select carrying the filter options.
You have to use some javascript code to make the pulldown work (e.g. with the source code below).
Make sure to wrap the filter with spaceless-tags to avoid whitespaces.
{% filter force_escape %}
{% templatetag openblock %} spaceless {% templatetag closeblock %}
{% templatetag openblock %} endspaceless {% templatetag closeblock %}
{% endfilter %}
{% filter force_escape %}
(function($) {
$(document).ready(function() {
$("a.grp-pulldown-handler").click(function() {
var pulldownContainer = $(this).closest(".grp-pulldown-container");
$(pulldownContainer).toggleClass("grp-pulldown-state-open").children(".grp-pulldown-content").toggle();
});
$("a.grp-pulldown-handler").bind('mouseout', function() {
$(this).blur();
});
$(".grp-filter-choice").change(function(){
location.href = $(this).val();
});
});
})(grp.jQuery);
{% endfilter %}
Take a look at Grappellis filter.html to get the full code of a filter (e.g. like it is used in a change-list).