yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixes list view search debounce and adds a ui indication that search is in progress.

Browse Source
This commit is contained in:
Shannon
2015-07-27 18:48:41 +02:00
parent 926ea54c39
commit 7a8b8f138f
2 changed files with 21 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.controller.js
View File

@@ -140,8 +140,12 @@ function listViewController($rootScope, $scope, $routeParams, $injector, notific
/*Pagination is done by an array of objects, due angularJS's funky way of monitoring state
with simple values */
$scope.reloadView = function(id) {
$scope.reloadView = function (id) {
getListResultsCallback(id, $scope.options).then(function (data) {
$scope.actionInProgress = false;
$scope.listViewResultSet = data;
//update all values for display
@@ -203,11 +207,17 @@ function listViewController($rootScope, $scope, $routeParams, $injector, notific
});
};
//assign debounce method to the search to limit the queries
$scope.search = _.debounce(function() {
$scope.options.pageNumber = 1;
$scope.reloadView($scope.contentId);
}, 100);
$scope.$watch(function() {
return $scope.options.filter;
}, _.debounce(function(newVal, oldVal) {
$scope.$apply(function() {
if (newVal !== null && newVal !== undefined && newVal !== oldVal) {
$scope.options.pageNumber = 1;
$scope.actionInProgress = true;
$scope.reloadView($scope.contentId);
}
});
}, 200));
$scope.enterSearch = function($event) {
$($event.target).next().focus();

6
src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/listview.html
View File

@@ -39,11 +39,15 @@
</a>
</div>
<span ng-bind="bulkStatus" ng-show="isAnythingSelected()"></span>
<div class="umb-loader-wrapper" ng-show="actionInProgress">
<div class="umb-loader"></div>
</div>
<form class="form-search pull-right" novalidate>
<div class="inner-addon left-addon">
<i class="icon icon-search" ng-click="enterSearch($event)"></i>
<input type="text" class="form-control" localize="placeholder" placeholder="@general_typeToSearch" ng-model="options.filter" on-keyup="search()" prevent-enter-submit no-dirty-check>
<input type="text" class="form-control" localize="placeholder" placeholder="@general_typeToSearch" ng-model="options.filter" prevent-enter-submit no-dirty-check>
</div>
</form>
</div>