Adding a Search Filter to Orchard Workflows Toolbox

This commit is contained in:
Stanley Goldman
2013-10-29 09:13:19 -04:00
parent 21e269ef20
commit 8ae9be76b9
3 changed files with 25 additions and 2 deletions

View File

@@ -81,6 +81,19 @@
displaySaveMessage();
}
});
$("#search-box").focus().on("keyup", function (e) {
var text = $(this).val();
if (text == "") {
$(".activity-toolbox-item").show();
} else {
var lowerCaseText = text.toLowerCase();
$(".activity-toolbox-item").each(function () {
var recordText = $(this).data("activity-text").toLowerCase();
$(this).toggle(recordText.indexOf(lowerCaseText) >= 0);
});
}
});
var renderActivity = function (clientId, id, name, state, start, top, left) {

View File

@@ -125,6 +125,12 @@
margin-left: -302px; /* width + borders */
}
#activity-toolbox .bulk-actions {
margin-top: 10px;
margin-bottom: 5px;
margin-left: 5px;
}
#activity-toolbox .activity-toolbox-item {
display: block;
margin: 5px 5px;
@@ -278,4 +284,4 @@
.dir-rtl .toolbox-event div {
margin-left: inherit;
margin-right: 36px;
}
}

View File

@@ -5,10 +5,14 @@
@{
IList<IActivity> allActivities = Model.AllActivities;
}
<fieldset class="bulk-actions">
<label for="search-box">@T("Filter:")</label>
<input id="search-box" class="text" type="text" autocomplete="off" />
</fieldset>
<!-- List of available activities -->
<ul>
@foreach (var activity in allActivities) {
<li class="activity-toolbox-item toolbox-@(activity.IsEvent ? "event" : "task") toolbox-@activity.Name.HtmlClassify()" data-activity-name="@activity.Name" title="@activity.Description">
<li class="activity-toolbox-item toolbox-@(activity.IsEvent ? "event" : "task") toolbox-@activity.Name.HtmlClassify()" data-activity-name="@activity.Name" data-activity-text="@activity.Name.CamelFriendly()" title="@activity.Description">
<div>
<h2>@activity.Name.CamelFriendly()</h2>
<span class="hint">@activity.Description</span>