#3938 Search parameter example
HTML
<link rel="stylesheet" href="https://semantic-ui.com/dist/semantic.css">
<script src="https://semantic-ui.com/dist/semantic.js"></script>
<div class="ui search">
<div class="ui icon input">
<input class="prompt" type="text" placeholder="Search countries...">
<i class="search icon"></i>
</div>
<div class="results"></div>
</div>
CSS
body {
padding: 1em;
}
JavaScript
$('.ui.search')
.search({
type: 'category',
minCharacters: 3,
apiSettings: {
onResponse: function (githubResponse) {
var
response = {
results: {}
}
;
// translate GitHub API response to work with search
$.each(githubResponse, function (index, item) {
var neighborhoodStreet = item.neighborhoodStreet || 'Unknown',
maxResults = 32
;
if (index >= maxResults) {
return false;
}
// create new neighborhoodStreet category
if (response.results[neighborhoodStreet] === undefined) {
response.results[neighborhoodStreet] = {
name: neighborhoodStreet,
results: []
};
}
// add result to category
response.results[neighborhoodStreet].results.push({
title: item.addressStreet,
description: item.postalCodeStreet,
url: item.html_url
});
});
return response;
},
url: 'https://api.github.com/search/repositories?q={query}'
}
})
;