1
0
Fork 0
mirror of https://github.com/retspen/webvirtcloud synced 2024-11-01 03:54:15 +00:00

Add search in table

This commit is contained in:
Retspen 2015-03-11 09:07:30 +02:00
parent 5f6b06b467
commit 1e91fb303f
3 changed files with 43 additions and 5 deletions

View file

@ -79,3 +79,7 @@ body {
.ace_editor {
height: 350px;
}
.search {
margin: 5px;
}

View file

@ -19,6 +19,9 @@
<div class="row">
<div class="col-lg-12">
<div class="table-responsive">
<div class="pull-right search">
<input id="filter" class="form-control" type="text" placeholder="Search">
</div>
{% if request.user.is_superuser %}
<table class="table table-hover table-striped sortable-theme-bootstrap" data-sortable>
<thead>
@ -31,7 +34,7 @@
<th data-sortable="false" style="width: 165px;">Actions</th>
</tr>
</thead>
<tbody>
<tbody class="searchable">
{% for host, inst in all_host_vms.items %}
{% for vm, info in inst.items %}
<tr>
@ -105,6 +108,9 @@
</tbody>
</table>
{% else %}
<div class="pull-right search">
<input id="filter" class="form-control" type="text" placeholder="Search">
</div>
<table class="table table-hover table-striped">
<thead>
<tr>
@ -115,8 +121,7 @@
<th>Actions</th>
</tr>
</thead>
<tbody>
<tbody class="searchable">
{% for host, vm in all_user_vms.items %}
<tr>
<td><a href="{% url 'instance' host.0 vm.name %}">{{ vm.name }}</a></td>
@ -205,4 +210,17 @@
window.location = "/create/" + compute + "/";
}
</script>
<script>
$(document).ready(function () {
(function ($) {
$('#filter').keyup(function () {
var rex = new RegExp($(this).val(), 'i');
$('.searchable tr').hide();
$('.searchable tr').filter(function () {
return rex.test($(this).text());
}).show();
})
}(jQuery));
});
</script>
{% endblock %}

View file

@ -80,7 +80,10 @@
<h3 class="page-header">{% trans "Volumes" %}</h3>
{% if volumes %}
<div class="table-responsive">
<table class="table table-striped table-bordered sortable-theme-bootstrap" data-sortable>
<div class="pull-right search">
<input id="filter" class="form-control" type="text" placeholder="Search">
</div>
<table class="table table-striped sortable-theme-bootstrap" data-sortable>
<thead>
<tr>
<th style="width:35px;">#</th>
@ -90,7 +93,7 @@
<th data-sortable="false" colspan="2">{% trans "Action" %}</th>
</tr>
</thead>
<tbody>
<tbody class="searchable">
{% for volume in volumes %}
<tr>
<td>{{ forloop.counter }}</td>
@ -202,4 +205,17 @@
}
});
</script>
<script>
$(document).ready(function () {
(function ($) {
$('#filter').keyup(function () {
var rex = new RegExp($(this).val(), 'i');
$('.searchable tr').hide();
$('.searchable tr').filter(function () {
return rex.test($(this).text());
}).show();
})
}(jQuery));
});
</script>
{% endblock %}