mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-17 23:44:39 -05:00
Display "No results" message when no search results found
no issue - add a "No results" element to the search dropdown on creation and show/hide it appropriately
This commit is contained in:
parent
3002c1b0a4
commit
580eaf0e6b
3 changed files with 27 additions and 1 deletions
|
@ -117,13 +117,36 @@ export default Ember.Component.extend({
|
||||||
this.get('_selectize').focus();
|
this.get('_selectize').focus();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
onInit: function () {
|
||||||
|
var selectize = this.get('_selectize'),
|
||||||
|
html = '<div class="dropdown-empty-message">No results...</div>';
|
||||||
|
|
||||||
|
selectize.$empty_results_container = $(html);
|
||||||
|
selectize.$empty_results_container.hide();
|
||||||
|
selectize.$dropdown.append(selectize.$empty_results_container);
|
||||||
|
},
|
||||||
|
|
||||||
onFocus: function () {
|
onFocus: function () {
|
||||||
this._setKeymasterScope();
|
this._setKeymasterScope();
|
||||||
this.refreshContent();
|
this.refreshContent();
|
||||||
},
|
},
|
||||||
|
|
||||||
onBlur: function () {
|
onBlur: function () {
|
||||||
|
var selectize = this.get('_selectize');
|
||||||
|
|
||||||
this._resetKeymasterScope();
|
this._resetKeymasterScope();
|
||||||
|
selectize.$empty_results_container.hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
onType: function () {
|
||||||
|
var selectize = this.get('_selectize');
|
||||||
|
|
||||||
|
if (!selectize.hasOptions) {
|
||||||
|
selectize.open();
|
||||||
|
selectize.$empty_results_container.show();
|
||||||
|
} else {
|
||||||
|
selectize.$empty_results_container.hide();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -209,7 +209,8 @@
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
}
|
}
|
||||||
.selectize-dropdown [data-selectable],
|
.selectize-dropdown [data-selectable],
|
||||||
.selectize-dropdown .optgroup-header {
|
.selectize-dropdown .optgroup-header,
|
||||||
|
.selectize-dropdown .dropdown-empty-message {
|
||||||
padding: 5px 8px;
|
padding: 5px 8px;
|
||||||
}
|
}
|
||||||
.selectize-dropdown .optgroup:first-child .optgroup-header {
|
.selectize-dropdown .optgroup:first-child .optgroup-header {
|
||||||
|
|
|
@ -8,7 +8,9 @@
|
||||||
optionGroupPath="content.category"
|
optionGroupPath="content.category"
|
||||||
openOnFocus=false
|
openOnFocus=false
|
||||||
maxItems="1"
|
maxItems="1"
|
||||||
|
on-init="onInit"
|
||||||
on-focus="onFocus"
|
on-focus="onFocus"
|
||||||
on-blur="onBlur"
|
on-blur="onBlur"
|
||||||
|
update-filter="onType"
|
||||||
select-item="openSelected"}}
|
select-item="openSelected"}}
|
||||||
<button class="gh-nav-search-button" {{action "focusInput"}}><i class="icon-search"></i><span class="sr-only">Search</span></button>
|
<button class="gh-nav-search-button" {{action "focusInput"}}><i class="icon-search"></i><span class="sr-only">Search</span></button>
|
||||||
|
|
Loading…
Add table
Reference in a new issue