Enter Key not submitting correctly

[phersh]

Hi,

In my application I can request a different URL based on a forms drop down and and a text value. I want to be able to submit via enter key but the code below doesn't work. The enter key ignores my location.href assigment and the page simply refreshes to its current location:

<SCRIPT type="text/javascript">

function testResults (form) {
var TestVar = form.inputbox.value;

var searchType= form.searchtype.options[form.searchtype.selectedIndex].value;
// alert(searchType);
var searchURL =    searchType + "?search=" +   encodeURIComponent( TestVar)
// alert ("Search: " +         searchType +  "?search=" + TestVar + "\nURL: " + searchURL  );

alert(searchURL);

location.href =searchURL;

}
</SCRIPT>


<SCRIPT TYPE="text/javascript">
<!--
function submitViaEnter(evt) {
    evt = (evt) ? evt : event;
    var target = (evt.target) ? evt.target : evt.srcElement;
    var form = target.form;
    var charCode = (evt.charCode) ? evt.charCode :
        ((evt.which) ? evt.which : evt.keyCode);
    if (charCode == 13 || charCode == 3) {
        alert("Enter!");
        testResults(document.searchform)
        
        // form.submit();
    }
    return true;
}
//-->
</SCRIPT>



<FORM NAME="searchform" ACTION="" METHOD="get">
            <div id="shortcutSearch">
                
                	 Search:x
                	<select NAME="searchtype">
                		<option value="donors.html">Donors</option>
                    <option value="specimenCollections.html">Collections</option>
                    <option value="specimenSearchResults.html">Results</option>
                </select>

<INPUT TYPE="text" size="15" NAME="inputbox" VALUE="" onKeyPress="submitViaEnter(event)">
<INPUT TYPE="button" NAME="button" Value="Search" onClick="testResults(this.form)">

     
            </div></FORM>

For example, if I select Collections from the drop down box and type c in the text box and then *click* submit, the URL requested from my server is:

http://localhost:8080/esol11/specimenCollections.html?search=c

If I select Collections and type c in the text box and click enter - I see the alert("Enter!") message and I see the alerts in the testResults function but the browser requests:

http://localhost:8080/esol11/donors.html?searchtype=specimenCollections.html&inputbox=c

which is *really* wierd - those are the form field names.

Any help or guidance would be appreciated.
Thanks,
Phil

 

[kaht]

Why don't you just use a submit button and leave all the validation checking up to the onsubmit handler on the form? That way you don't have to do all extra coding to perform the functionality that already inherently exists.

-kaht

How much you wanna make a bet I can throw a football over them mountains?

 

[phersh]

Hi kaht,

I changed the button to:
<INPUT TYPE="submit" NAME="button" Value="Search" onsubmit="testResults(this.form)">

Now both hitting enter and clicking Search generates that wierd URL request with the form field names:

http://localhost:8080/esol11/donors.html?searchtype=donors.html&inputbox=d&button=Search

Phil

 

[kaht]

Providing a link to localhost:8080 won't help anybody outside of your int[!]ra[/!]net. You have to give us an int[!]er[/!]net address if you want us to see the page - or paste a "view page source" so that we can put it into one of our own new .html files.

-kaht

How much you wanna make a bet I can throw a football over them mountains?

 

[BillyRayPreachersSon]

If I select Collections and type c in the text box and click enter - I see the alert("Enter!") message and I see the alerts in the testResults function but the browser requests:

http://localhost:8080/esol11/donors.html?searchtype=specimenCollections.html&inputbox=c

which is *really* wierd - those are the form field names.

That's not weird at all - that's how the GET method works. If you don't want that, use the POST method instead.

Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]