javascript - Semantic UI - Adding Logic Around Search Box -
i'm trying add logic around search box according user selected dropdown box.
search box:
<div class="ui search"> <div class="ui left loading icon input"> <input class="prompt" type="text" placeholder="search youtube" value=""> <i class="icon"></i> </div> </div>
a dropdown:
<div class="ui selection dropdown"> <input name="type" type="hidden" value=""> <i class="dropdown icon"></i> <div class="default text">search type</div> <div class="menu"> <div class="item" data-value="1">channel id</div> <div class="item" data-value="0">user name</div> </div> </div>
for example, if user selects b on dropdown box, query command query b={some value}
, , a=blank
. if user selects on dropdown box, b=blank
, , a={some value}
.
this i've tried do, i'm not sure how wrap around $('.ui.search')
function logic. or possible have multiple queries, example q={id}?results={count}
, keep string externally, when user types on search, modify var
keeps url variable, , insert apisetting's url field.
$('.ui.search') .search ( { apisettings: { onresponse: function (response) { console.log("hellop"); console.log($('.ui.dropdown').dropdown('get value')); }, url: 'http://192.168.219.130:8888/' }, } ) $('.ui.dropdown').dropdown({});
greatly appreciate if can point me right direction on how handled in semantic ui framework.
you'll want modify api request url , settings before api request sent. can done beforesend
callback of apisettings
object.
your search initialization this:
$('.ui.search') .search ({ apisettings: { onbeforesend: function(settings) { // depending on logic, modify url here settings.url = 'http://192.168.219.130:8888/'; return settings; }, onresponse: function (response) { console.log("hellop"); console.log($('.ui.dropdown').dropdown('get value')); }, url: 'http://192.168.219.130:8888/' }, })
some more information can found on semantic ui api usage page.
Comments
Post a Comment