StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>First of all... welcome to the Web development world (it's way more sexy than Cobol... LOL). Since you're fairly new to JavaScript, I would like to suggest that you start with <a href="http://jquery.com/" rel="nofollow noreferrer">jQuery</a>. It's way easier and cleaner than doing the same task in traditional JS. Here's the code that for the two search boxes:</p> <p>HTML:</p> <pre><code><form id="peopleform" action="peoplesearch.aspx" method="post"> <label for="peoplesearch">People:</label> <input type="text" name="peoplesearch" id="peoplesearch"> <input type="image" id="peoplebutton" src="magnifyingglass.gif" alt="Search for people."> </form> <form id="intranetform" action="intranetsearch.aspx" method="post"> <label for="intranetsearch">Intranet:</label> <input type="text" name="intranetsearch" id="intranetsearch"> <input type="image" id="intranetbutton" src="magnifyingglass.gif" alt="Search the Intranet."> </form> </code></pre> <p>JavaScript:</p> <pre><code><script type="text/javascript"> $(document).ready(function(){ /* People Search */ $('#peoplesearch').keydown(function(e){ /* Detect key presses in the people search field */ if(e.keyCode==13) { /* Detect enter */ $('#peopleform').submit(); /* Submit people search form */ } }); $('#peoplebutton').click(function(){ /* Detect click on people search magnifying glass */ $('#peopleform').submit(); /* Submit people search form */ }); /* Intranet Search */ $('#intranetsearch').keydown(function(e){ /* Detect key presses in the Intranet search field */ if(e.keyCode==13) { /* Detect enter */ $('#intranetform').submit(); /* Submit Intranet search form */ } }); $('#intranetbutton').click(function(){ /* Detect click on Intranet search magnifying glass */ $('#intranetform').submit(); /* Submit Intranet search form */ }); }); </script> </code></pre> <p>I split the search boxes into two forms. That way you can avoid passing an identifier and the code becomes more obvious (you submit to two different pages on the server). You need to hook up jQuery, add your magnifying glass images and write the server side stuff, but I hope this gets you started.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

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