mirror of
https://github.com/ansible/awx.git
synced 2026-03-24 12:25:01 -02:30
Disable search submit until a search string is present
This commit is contained in:
@@ -13,7 +13,7 @@
|
|||||||
<span class="input-group-btn">
|
<span class="input-group-btn">
|
||||||
<button class="btn at-ButtonHollow--default at-Input-button"
|
<button class="btn at-ButtonHollow--default at-Input-button"
|
||||||
ng-click="vm.submitSearch()"
|
ng-click="vm.submitSearch()"
|
||||||
ng-disabled="vm.disabled"
|
ng-disabled="vm.disabled || !vm.value || vm.value === ''"
|
||||||
type="button">
|
type="button">
|
||||||
<i class="fa fa-search"></i>
|
<i class="fa fa-search"></i>
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@@ -76,10 +76,15 @@
|
|||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.SmartSearch-searchButton:hover {
|
.SmartSearch-searchButton:not(.SmartSearch-searchButton--disabled):hover {
|
||||||
background-color: @default-tertiary-bg;
|
background-color: @default-tertiary-bg;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.SmartSearch-searchButton--disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
opacity: 0.65;
|
||||||
|
}
|
||||||
|
|
||||||
.SmartSearch-flexContainer {
|
.SmartSearch-flexContainer {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@@ -174,43 +174,45 @@ function SmartSearchController (
|
|||||||
};
|
};
|
||||||
|
|
||||||
$scope.addTerms = terms => {
|
$scope.addTerms = terms => {
|
||||||
const { singleSearchParam } = $scope;
|
if (terms && terms !== "") {
|
||||||
const unmodifiedQueryset = _.clone(queryset);
|
const { singleSearchParam } = $scope;
|
||||||
|
const unmodifiedQueryset = _.clone(queryset);
|
||||||
|
|
||||||
const searchInputQueryset = qs.getSearchInputQueryset(terms, isFilterableBaseField, isRelatedField, isAnsibleFactField, singleSearchParam);
|
const searchInputQueryset = qs.getSearchInputQueryset(terms, isFilterableBaseField, isRelatedField, isAnsibleFactField, singleSearchParam);
|
||||||
queryset = qs.mergeQueryset(queryset, searchInputQueryset, singleSearchParam);
|
queryset = qs.mergeQueryset(queryset, searchInputQueryset, singleSearchParam);
|
||||||
|
|
||||||
// Go back to the first page after a new search
|
// Go back to the first page after a new search
|
||||||
delete queryset.page;
|
delete queryset.page;
|
||||||
|
|
||||||
// https://ui-router.github.io/docs/latest/interfaces/params.paramdeclaration.html#dynamic
|
// https://ui-router.github.io/docs/latest/interfaces/params.paramdeclaration.html#dynamic
|
||||||
// This transition will not reload controllers/resolves/views but will register new
|
// This transition will not reload controllers/resolves/views but will register new
|
||||||
// $stateParams[searchKey] terms.
|
// $stateParams[searchKey] terms.
|
||||||
if (!$scope.querySet) {
|
if (!$scope.querySet) {
|
||||||
transitionSuccessListener();
|
transitionSuccessListener();
|
||||||
$state.go('.', { [searchKey]: queryset })
|
$state.go('.', { [searchKey]: queryset })
|
||||||
.then(() => {
|
.then(() => {
|
||||||
// same as above in $scope.remove. For some reason deleting the page
|
// same as above in $scope.remove. For some reason deleting the page
|
||||||
// from the queryset works for all lists except lists in modals.
|
// from the queryset works for all lists except lists in modals.
|
||||||
delete $stateParams[searchKey].page;
|
delete $stateParams[searchKey].page;
|
||||||
listenForTransitionSuccess();
|
listenForTransitionSuccess();
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
qs.search(path, queryset)
|
||||||
|
.then(({ data }) => {
|
||||||
|
if ($scope.querySet) {
|
||||||
|
$scope.querySet = queryset;
|
||||||
|
}
|
||||||
|
$scope.dataset = data;
|
||||||
|
$scope.collection = data.results;
|
||||||
|
$scope.$emit('updateDataset', data);
|
||||||
|
})
|
||||||
|
.catch(() => revertSearch(unmodifiedQueryset));
|
||||||
|
|
||||||
|
$scope.searchTerm = null;
|
||||||
|
|
||||||
|
generateSearchTags();
|
||||||
}
|
}
|
||||||
|
|
||||||
qs.search(path, queryset)
|
|
||||||
.then(({ data }) => {
|
|
||||||
if ($scope.querySet) {
|
|
||||||
$scope.querySet = queryset;
|
|
||||||
}
|
|
||||||
$scope.dataset = data;
|
|
||||||
$scope.collection = data.results;
|
|
||||||
$scope.$emit('updateDataset', data);
|
|
||||||
})
|
|
||||||
.catch(() => revertSearch(unmodifiedQueryset));
|
|
||||||
|
|
||||||
$scope.searchTerm = null;
|
|
||||||
|
|
||||||
generateSearchTags();
|
|
||||||
};
|
};
|
||||||
// remove tag, merge new queryset, $state.go
|
// remove tag, merge new queryset, $state.go
|
||||||
$scope.removeTerm = index => {
|
$scope.removeTerm = index => {
|
||||||
|
|||||||
@@ -7,7 +7,7 @@
|
|||||||
<input class="SmartSearch-input" ng-model="searchTerm" placeholder="{{searchPlaceholder}}"
|
<input class="SmartSearch-input" ng-model="searchTerm" placeholder="{{searchPlaceholder}}"
|
||||||
ng-disabled="disableSearch">
|
ng-disabled="disableSearch">
|
||||||
</form>
|
</form>
|
||||||
<div type="submit" class="SmartSearch-searchButton" ng-disabled="!searchTerm" ng-click="addTerms(searchTerm)">
|
<div type="submit" class="SmartSearch-searchButton" ng-class="{'SmartSearch-searchButton--disabled': !searchTerm || searchTerm === ''}" ng-click="addTerms(searchTerm)">
|
||||||
<i class="fa fa-search"></i>
|
<i class="fa fa-search"></i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user