Skip to content

Commit

Permalink
Fix minisearch not appear when disable suggestions search
Browse files Browse the repository at this point in the history 
update
  • Loading branch information
@mrtuvn
mrtuvn committed Oct 26, 2020
1 parent 3bcbd95 commit 1f9766c
Show file tree
Hide file tree
Showing 2 changed files with 72 additions and 66 deletions.
38 changes: 21 additions & 17 deletions app/code/Magento/Search/view/frontend/templates/form.mini.phtml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,40 +4,32 @@
* See COPYING.txt for license details.
*/

// phpcs:disable Magento2.Templates.ThisInTemplate.FoundThis
?>
<?php
/** @var $block \Magento\Framework\View\Element\Template */
/** @var $helper \Magento\Search\Helper\Data */
/** @var $escaper \Magento\Framework\Escaper */
/** @var $configProvider \Magento\Search\ViewModel\ConfigProvider */
$helper = $this->helper(\Magento\Search\Helper\Data::class);
$configProvider = $block->getData('configProvider');
?>
<div class="block block-search">
<div class="block block-title"><strong><?= $block->escapeHtml(__('Search')) ?></strong></div>
<div class="block block-title"><strong><?= $escaper->escapeHtml(__('Search')) ?></strong></div>
<div class="block block-content">
<form class="form minisearch" id="search_mini_form"
action="<?= $block->escapeUrl($helper->getResultUrl()) ?>" method="get">
action="<?= $escaper->escapeUrl($helper->getResultUrl()) ?>" method="get">
<div class="field search">
<label class="label" for="search" data-role="minisearch-label">
<span><?= $block->escapeHtml(__('Search')) ?></span>
<span><?= $escaper->escapeHtml(__('Search')) ?></span>
</label>
<div class="control">
<input id="search"
<?php if ($configProvider->isSuggestionsAllowed()):?>
data-mage-init='{"quickSearch":{
"formSelector":"#search_mini_form",
"url":"<?= $block->escapeUrl($helper->getSuggestUrl())?>",
"destinationSelector":"#search_autocomplete",
"minSearchLength":"<?= $block->escapeHtml($helper->getMinQueryLength()) ?>"}
}'
<?php endif;?>
type="text"
name="<?= $block->escapeHtmlAttr($helper->getQueryParamName()) ?>"
name="<?= $escaper->escapeHtmlAttr($helper->getQueryParamName()) ?>"
value="<?= /* @noEscape */ $helper->getEscapedQueryText() ?>"
placeholder="<?= $block->escapeHtmlAttr(__('Search entire store here...')) ?>"
placeholder="<?= $escaper->escapeHtmlAttr(__('Search entire store here...')) ?>"
class="input-text"
maxlength="<?= $block->escapeHtmlAttr($helper->getMaxQueryLength()) ?>"
maxlength="<?= $escaper->escapeHtmlAttr($helper->getMaxQueryLength()) ?>"
role="combobox"
aria-haspopup="false"
aria-autocomplete="both"
Expand All @@ -49,13 +41,25 @@ $configProvider = $block->getData('configProvider');
</div>
<div class="actions">
<button type="submit"
title="<?= $block->escapeHtml(__('Search')) ?>"
title="<?= $escaper->escapeHtml(__('Search')) ?>"
class="action search"
aria-label="Search"
>
<span><?= $block->escapeHtml(__('Search')) ?></span>
<span><?= $escaper->escapeHtml(__('Search')) ?></span>
</button>
</div>
</form>
</div>
</div>
<script type="text/x-magento-init">
{
"#search": {
"quickSearch": {
"formSelector":"#search_mini_form",
"url":"<?= ($configProvider->isSuggestionsAllowed()) ? $escaper->escapeUrl($helper->getSuggestUrl()) : '' ?>",
"destinationSelector":"#search_autocomplete",
"minSearchLength":"<?= $escaper->escapeHtml($helper->getMinQueryLength()) ?>"
}
}
}
</script>
100 changes: 51 additions & 49 deletions app/code/Magento/Search/view/frontend/web/js/form-mini.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -300,60 +300,62 @@ define([

if (value.length >= parseInt(this.options.minSearchLength, 10)) {
this.submitBtn.disabled = false;
$.getJSON(this.options.url, {
q: value
}, $.proxy(function (data) {
if (data.length) {
$.each(data, function (index, element) {
var html;

element.index = index;
html = template({
data: element
if (this.options.url) {
$.getJSON(this.options.url, {
q: value
}, $.proxy(function (data) {
if (data.length) {
$.each(data, function (index, element) {
var html;

element.index = index;
html = template({
data: element
});
dropdown.append(html);
});
dropdown.append(html);
});

this._resetResponseList(true);

this.responseList.indexList = this.autoComplete.html(dropdown)
.css(clonePosition)
.show()
.find(this.options.responseFieldElements + ':visible');

this.element.removeAttr('aria-activedescendant');

if (this.responseList.indexList.length) {
this._updateAriaHasPopup(true);
this._resetResponseList(true);

this.responseList.indexList = this.autoComplete.html(dropdown)
.css(clonePosition)
.show()
.find(this.options.responseFieldElements + ':visible');

this.element.removeAttr('aria-activedescendant');

if (this.responseList.indexList.length) {
this._updateAriaHasPopup(true);
} else {
this._updateAriaHasPopup(false);
}

this.responseList.indexList
.on('click', function (e) {
this.responseList.selected = $(e.currentTarget);
this.searchForm.trigger('submit');
}.bind(this))
.on('mouseenter mouseleave', function (e) {
this.responseList.indexList.removeClass(this.options.selectClass);
$(e.target).addClass(this.options.selectClass);
this.responseList.selected = $(e.target);
this.element.attr('aria-activedescendant', $(e.target).attr('id'));
}.bind(this))
.on('mouseout', function (e) {
if (!this._getLastElement() &&
this._getLastElement().hasClass(this.options.selectClass)) {
$(e.target).removeClass(this.options.selectClass);
this._resetResponseList(false);
}
}.bind(this));
} else {
this._resetResponseList(true);
this.autoComplete.hide();
this._updateAriaHasPopup(false);
this.element.removeAttr('aria-activedescendant');
}

this.responseList.indexList
.on('click', function (e) {
this.responseList.selected = $(e.currentTarget);
this.searchForm.trigger('submit');
}.bind(this))
.on('mouseenter mouseleave', function (e) {
this.responseList.indexList.removeClass(this.options.selectClass);
$(e.target).addClass(this.options.selectClass);
this.responseList.selected = $(e.target);
this.element.attr('aria-activedescendant', $(e.target).attr('id'));
}.bind(this))
.on('mouseout', function (e) {
if (!this._getLastElement() &&
this._getLastElement().hasClass(this.options.selectClass)) {
$(e.target).removeClass(this.options.selectClass);
this._resetResponseList(false);
}
}.bind(this));
} else {
this._resetResponseList(true);
this.autoComplete.hide();
this._updateAriaHasPopup(false);
this.element.removeAttr('aria-activedescendant');
}
}, this));
}, this));
}
} else {
this._resetResponseList(true);
this.autoComplete.hide();
Expand Down

0 comments on commit 1f9766c

Please sign in to comment.