mirror of
https://github.com/yiisoft/yii2.git
synced 2025-11-15 05:45:33 +08:00
improved usability for the apidoc search
This commit is contained in:
@@ -119,8 +119,12 @@ table.summary-table .col-defined { width: 15%; }
|
||||
top: 50px;
|
||||
z-index: 1000;
|
||||
|
||||
background: #fff;
|
||||
border: solid 1px #000;
|
||||
border-radius: 0;
|
||||
/* reset all due to android browser issues http://caniuse.com/#search=border-radius */
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
#search-results {
|
||||
|
||||
@@ -83,15 +83,13 @@ $this->beginPage();
|
||||
$this->registerJsFile('./jssearch.index.js', 'yii\apidoc\templates\bootstrap\assets\JsSearchAsset');
|
||||
$this->registerJs(<<<JS
|
||||
|
||||
$('#searchbox').focus();
|
||||
var searchBox = $('#searchbox');
|
||||
|
||||
$(document).on("keyup", function(event) {
|
||||
if (event.which == 27) {
|
||||
$('#search-resultbox').hide();
|
||||
}
|
||||
});
|
||||
// focus the search field
|
||||
searchBox.focus();
|
||||
|
||||
$('#searchbox').on("keyup", function(event) {
|
||||
// search when typing in search field
|
||||
searchBox.on("keyup", function(event) {
|
||||
var query = $(this).val();
|
||||
|
||||
if (query == '' || event.which == 27) {
|
||||
@@ -151,13 +149,22 @@ $('#searchbox').on("keyup", function(event) {
|
||||
$('#search-results').html(resHtml);
|
||||
}
|
||||
});
|
||||
|
||||
// hide the search results on ESC
|
||||
$(document).on("keyup", function(event) { if (event.which == 27) { $('#search-resultbox').hide(); } });
|
||||
// hide search results on click to document
|
||||
$(document).bind('click', function (e) { $('#search-resultbox').hide(); });
|
||||
// except the following:
|
||||
searchBox.bind('click', function(e) { e.stopPropagation(); });
|
||||
$('#search-resultbox').bind('click', function(e) { e.stopPropagation(); });
|
||||
|
||||
JS
|
||||
);
|
||||
|
||||
NavBar::end();
|
||||
?>
|
||||
|
||||
<div id="search-resultbox" style="display: none;">
|
||||
<div id="search-resultbox" style="display: none;" class="modal-content">
|
||||
<ul id="search-results">
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user