apologies repost of thread can no longer access or comment on.
i trying write javascript function search of specified divs in html page substring contained in search bar. how can simply?
here code far, have working showme
method display divs selected, need substring code work now. please help?
<html> <head> <script type="text/javascript"> function dynamicsearch() { var val = document.getelementbyid('search').value; if (val == '') val = '-1'; var srch = new regexp(val, "gi"); var els = document.getelementsbyclassname('row'); (var idx in els) { if (idx != parseint(idx)) continue; var el = els[idx]; if (typeof(el.innerhtml) !== 'undefined') { console.log(el.innerhtml); if (srch.test(el.innerhtml)) { el.style.display = 'block'; } else { el.style.display = 'none'; } } } } function showme (it, box) { var vis = (box.checked) ? "block" : "none"; document.getelementbyid(it).style.display = vis; } </script> </head> <body> <form> <label for="search">search:</label> <input type="text" name="search" id="search" onkeyup="dynamicsearch()"/> <input type="checkbox" name="modtype" value="value1" onclick="showme('div1', this)" />value1 <input type="checkbox" name="modtype" value="value2" onclick="showme('div2', this)" />value2 <input type="checkbox" name="modtype" value="value3" onclick="showme('div3', this)" />value3 <input type="checkbox" name="modtype" value="value4" onclick="showme('div4', this)" />value4 <input type="checkbox" name="modtype" value="value5" onclick="showme('div5', this)" />value5 <div class="row" id="div1" style="display:none">show div 1</div> <div class="row" id="div2" style="display:none">show div 2</div> <div class="row" id="div3" style="display:none">show div 3</div> <div class="row" id="div4" style="display:none">show div 4</div> <div class="row" id="div5" style="display:none">show div 5</div> </form> </body> </html>
the code have here runs correctly checkboxes, cannot display searched substring result(ie dynamicsearch function not work, showme 1 does...or @ least cannot dynamicsearch code work?)
what wrong simple loop?
function dosearch() { var val = $('searchbox').value; var els = document.getelementsbyclassname('thedivs') //or similar, whatever need //var els = document.getelementsbytagname('div') (el in els) { if (el.innerhtml.indexof(val) >= 0) el.style.display = 'block' else el.style.display = 'none' } }
edit: see fiddle - based off of other fiddle : http://jsfiddle.net/nlxc4/5/
Comments
Post a Comment