<html>
<head>
<title>Ajax filter search</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript">
function filterItems(x)
{
//For each div with class quote, show if contains x, else hide.
//if x is an empty string, show all
var quotes = getElementsByName_iefix("div", "quote");
var stringForExec = new RegExp(x, "i");
for (var i = 0; i < quotes.length; i++){
//if contains set visible
var text = quotes[i].innerHTML
//if(text.indexOf(x) != -1) {
if(stringForExec.exec(text)) {
quotes[i].style.display="block";
}
else {
quotes[i].style.display="none";
}
//else set hidden
}
}
function getElementsByName_iefix(tag, name) {
var elem = document.getElementsByTagName(tag);
var arr = new Array();
for(i = 0,iarr = 0; i < elem.length; i++) {
att = elem[i].getAttribute("name");
if(att == name) {
arr[iarr] = elem[i];
iarr++;
}
}
return arr;
}
</script>
</head>
<body>
<!-- Trenger et script som ser pa onKeyDown hvilke quote som passer teksten i boksen -->
<center>
<select name="filter" onChange="filterItems(this.value)">
<option value="">_Модель_</option>
<option value="BMW" >BMW</option>
<option value="WolksVagen" >WolksVagen</option>
<option value="Opel" >Opel</option>
</select>
<select name="filter" onChange="filterItems(this.value)">
<option value="">Кузов</option>
<option value="sedan" >sedan model</option>
<option value="cabrio" >cabrio model</option>
<option value="cabrio" >Hatchback model</option>
</select>
Filter: <input type="text" size="25" value="" name="filter" maxlength="25" onKeyUp="filterItems(this.value)">
</center>
<br/>
<div class="contentHolder">
<div class="quote2" name="quote">
<div class="said">BMW sedan model</div></div>
<div class="quote2" name="quote">
<div class="said">Opel sedan model</div></div>
<div class="quote2" name="quote">
<div class="said">WolksVagen sedan model</div></div>
<div class="quote2" name="quote">
<div class="said">BMW cabrio model</div></div>
<div class="quote2" name="quote">
<div class="said">Opel cabrio model</div></div>
<div class="quote2" name="quote">
<div class="said">WolksVagen cabrio model</div></div>
<div class="quote2" name="quote">
<div class="said">BMW Hatchback model</div></div>
<div class="quote2" name="quote">
<div class="said">Opel Hatchback model</div></div>
<div class="quote2" name="quote">
<div class="said">WolksVagen Hatchback model</div>
</div>
</div>
</body>
</html>