margin-left:24px;
}
+.tagfilter div.awesomplete {
+ width: inherit;
+}
+
.tagfilter #tagfilter_value {
- width: 10%;
+ width: 100%;
+ display: inline;
+}
+
+.tagfilter li {
+ color: black;
}
.tagfilter input.bigbutton, .searchform input.bigbutton, .addform input.bigbutton {
$PAGE->assign('redirector',empty($GLOBALS['redirector']) ? '' : $GLOBALS['redirector']); // Optional redirector URL.
$PAGE->assign('token',$token);
$PAGE->assign('links',$linkDisp);
+ $PAGE->assign('tags', $LINKSDB->allTags());
return;
}
<!DOCTYPE html>
<html>
-<head>{include="includes"}</head>
+<head>
+ <link type="text/css" rel="stylesheet" href="../inc/awesomplete.css" />
+ {include="includes"}
+</head>
<body>
<div id="pageheader">
{include="page.header"}
<div id="headerform" class="search">
<form method="GET" class="searchform" name="searchform"><input type="text" id="searchform_value" name="searchterm" placeholder="Search text" value=""> <input type="submit" value="Search" class="bigbutton"></form>
- <form method="GET" class="tagfilter" name="tagfilter"><input type="text" name="searchtags" id="tagfilter_value" placeholder="Filter by tag" value=""> <input type="submit" value="Search" class="bigbutton"></form>
+ <form method="GET" class="tagfilter" name="tagfilter">
+ <input type="text" name="searchtags" id="tagfilter_value" placeholder="Filter by tag" value="" list="tagsList" autocomplete="off" class="awesomplete" data-minChars="1">
+ <datalist id="tagsList">
+ {loop="$tags"}<option>{$key}</option>{/loop}
+ </datalist>
+ <input type="submit" value="Search" class="bigbutton">
+ </form>
</div>
</div>
return false;
}
</script>
+<script src="inc/awesomplete.min.js#"></script>
</body>
</html>