mirror of
https://git.yoctoproject.org/poky
synced 2026-05-02 18:32:15 +02:00
1b636173ca
This patch implements table searching, filtering and ordering, in a
generic mode reusable for all tables.
The search operates list of fields defined in the corresponding
class for each model, search_allowed_fields.
The search expression and filters are sent through GET requests
using a QuerySet-like input. The inputs are filtered and
validated before usage to prevent inadvertent or malicious use.
Filters and table headers are defined in the views for each table,
and rendered by generic code which is easily modified for various
tables.
The Build table and Configuration table are implemented using this
framework as an example of how it should be used.
[YOCTO #4249]
[YOCTO #4254]
[YOCTO #4255]
[YOCTO #4256]
[YOCTO #4257]
[YOCTO #4259]
[YOCTO #4260]
(Bitbake rev: 2ca15117e4bbda38cda07511d0ff317273f91528)
Signed-off-by: Alexandru DAMIAN <alexandru.damian@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>
74 lines
3.3 KiB
HTML
74 lines
3.3 KiB
HTML
<!-- component to display a generic table -->
|
|
<script>
|
|
function showhideTableColumn(clname, sh) {
|
|
if (sh) $('.' + clname).show();
|
|
else $('.' + clname).hide();
|
|
}
|
|
|
|
|
|
function filterTableRows(test) {
|
|
if (test.length > 0) {
|
|
var r = test.split(/[ ,]+/).map(function (e) { return new RegExp(e, 'i') });
|
|
$('tr.data').map( function (i, el) {
|
|
(! r.map(function (j) { return j.test($(el).html())}).reduce(function (c, p) { return c && p;} )) ? $(el).hide() : $(el).show();
|
|
});
|
|
} else
|
|
{
|
|
$('tr.data').show();
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<!-- control header -->
|
|
<div class="navbar">
|
|
<div class="navbar-inner">
|
|
<form class="navbar-search input-append pull-left" >
|
|
<input class="input-xxlarge" name="search" type="text" placeholder="Search {{objectname}}" value="{{request.GET.search}}"/>
|
|
<input class="btn" type="submit" value="Search"/>
|
|
</form>
|
|
<div class="pull-right">
|
|
{% if tablecols %}
|
|
<div class="btn-group">
|
|
<button class="btn dropdown-toggle" data-toggle="dropdown">Edit columns
|
|
<span class="caret"></span>
|
|
</button>
|
|
<ul class="dropdown-menu">{% for i in tablecols %}
|
|
<li>
|
|
<label class="checkbox">
|
|
<input type="checkbox" class="chbxtoggle" {% if i.clclass %}id="{{i.clclass}}" value="ct{{i.name}}" {% if not i.hidden %}checked="checked"{%endif%} onchange="showhideTableColumn($(this).attr('id'), $(this).is(':checked'))" {%else%} checked disabled{% endif %}/> {{i.name}}
|
|
</label>
|
|
</li>{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
<div style="display:inline">
|
|
<span class="divider-vertical"></span>
|
|
<span class="help-inline" style="padding-top:5px;">Show rows:</span>
|
|
<select style="margin-top:5px;margin-bottom:0px;" class="pagesize">
|
|
{% with "2 5 10 25 50 100" as list%}
|
|
{% for i in list.split %} <option{%if i == request.GET.count %} selected{%endif%}>{{i}}</option>
|
|
{% endfor %}
|
|
{% endwith %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div> <!-- navbar-inner -->
|
|
</div>
|
|
|
|
<!-- the actual rows of the table -->
|
|
<table class="table table-bordered table-hover tablesorter" id="otable">
|
|
<thead>
|
|
<!-- Table header row; generated from "tablecols" entry in the context dict -->
|
|
<tr>
|
|
{% for tc in tablecols %}<th class="{{tc.dclass}} {{tc.clclass}}">
|
|
{%if tc.qhelp%}<i class="icon-question-sign get-help" data-toggle="tooltip" title="{{tc.qhelp}}"></i>{%endif%}
|
|
<a href="javascript:reload_params({'orderby' : '{{tc.orderfield}}' })" style="font-weight:normal;">{{tc.name}}</a>
|
|
{%if tc.filter%}<div class="btn-group pull-right">
|
|
<a href="#filter_{{tc.filter.class}}" role="button" class="btn btn-mini{%if request.GET.filter in tc.filter.options.values%} btn-primary{%endif%}" data-toggle="modal"> <i class="icon-filter filtered"></i> </a>
|
|
</div>{%endif%}
|
|
</th>{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|