Note that there are some explanatory texts on larger screens.

plurals
  1. POinput box not working in firefox
    text
    copied!<p>I am trying to have a basic filter when someone puts a word into a input box and list items hide on click, this is working fine in chrome but in firefox it is not working at all. </p> <p>html:</p> <pre><code>&lt;form ACTION="#" id="navsform" class="my-search"&gt; &lt;input id="formwidth" type="text" name="query" placeholder="Search..."&gt; &lt;input type="submit" class="my-button" value="Search" onclick="query_searchvar()"&gt;&lt;/form&gt; </code></pre> <p>javascript:</p> <pre><code>function query_searchvar() { var searchquery=document.navsform.query.value.toLowerCase(); if(searchquery == '') {alert("No Text Entered"); } var queryarray = searchquery.split(/,|\s+/); event.preventDefault(); $('li').each(function() { var searchtags = $(this).attr('data-searchtags'); //alert(searchtags); var searcharray = searchtags.split(','); //alert(searcharray); var found = false; for (var i=0; i&lt;searcharray.length; i++) if ($.inArray(searcharray[i], queryarray)&gt;-1) { found = true; break; } if (found == true ) { $(this).show("normal"); } else { $(this).hide("normal"); } }); } </code></pre> <p>Any help much appreciated. Thank you. </p> <p>Hi, I managed to get this working with a combo of all your comments and some jquery resources: HTML:</p> <pre><code>&lt;form id="myform" action="#" class="my-search"&gt; &lt;input id="formwidth" type="text" name="query" placeholder="Search..." /&gt; &lt;input class="my-button" type="submit" value="Search" /&gt; &lt;/form&gt; $('#myform').submit(function() { var searchquery = String($('#myform input[name=query]').val()).toLowerCase(); if (searchquery == '') { alert('No Text Entered'); } var queryarray = searchquery.split(/,|\s+/); $('li').each(function() { var searchtags = $(this).attr('data-searchtags'); var searcharray = searchtags.split(','); var found = false; for (var i = 0; i &lt; searcharray.length; i++) if ($.inArray(searcharray[i], queryarray) &gt; -1) { found = true; break; } if (found == true) { $(this).show('normal'); } else { $(this).hide('normal'); } }); return false; }); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload