whoisgregg
msg:3192526 | 10:08 pm on Dec 18, 2006 (gmt 0) |
This should get you started... :) <select name="test_select" id="testSelect">
<option value="" selected="selected">Choose an option:</option>
<option value="5">Fiver</option>
<option value="10">Ten spot</option>
<option value="100">Bill</option>
</select>
<script type="text/javascript">
<!--
var theSelect = document.getElementById('testSelect');
theSelect.onchange = function(){
if(this.value && this.value!= ''){
location.href = '/directory/retrieve_data.php?id='+this.value;
}
}
//-->
</script>
|
|
|
Fotiman
msg:3192528 | 10:11 pm on Dec 18, 2006 (gmt 0) |
Of course, if you do that, your visitors with JavaScript disabled will have no way to submit the form. What you should do is provide a submit button and then remove the submit button using JavaScript. That way, it will work for all users, whether they have JavaScript disabled or not.
|
eelixduppy
msg:3192531 | 10:15 pm on Dec 18, 2006 (gmt 0) |
Or do something like this:
<noscript>
<input type="submit" />
</noscript>
:)
|
Fotiman
msg:3192536 | 10:18 pm on Dec 18, 2006 (gmt 0) |
Yes, but a <noscript> means less separation of layers. That is, you're including behavior stuff in your markup. If you want to keep a cleaner separation of content and behavior, then just include the input and then remove/hide it with JavaScript.
|
whoisgregg
msg:3193307 | 3:12 pm on Dec 19, 2006 (gmt 0) |
Improved sample code based on Fotiman's recommendations: <form action="/directory/retrieve_data.php" method="get">
<select name="id" id="testSelect">
<option value="" selected="selected">Choose an option:</option>
<option value="5">Fiver</option>
<option value="10">Ten spot</option>
<option value="100">Bill</option>
</select> <input type="submit" value="Go!" id="submitHide" />
</form>
<script type="text/javascript">
<!--
var theSelect = document.getElementById('testSelect');
var theSubmit = document.getElementById('submitHide');
theSubmit.style.display = 'none';
theSelect.onchange = function(){
if(this.value && this.value!= ''){
location.href = '/directory/retrieve_data.php?id='+this.value;
}
}
//-->
</script> |
|
|
Fotiman
msg:3193391 | 4:12 pm on Dec 19, 2006 (gmt 0) |
Love it! My final nitpick would be to remove the comment tags in the script: <script type="text/javascript">
<!--
...
//-->
</script> Would become:
<script type="text/javascript">
...
</script> Below is a quote [javascript.crockford.com] from Douglas Crockford [crockford.com]:
Do not use the <!-- //--> hack with scripts. It was intended to prevent scripts from showing up as text on the first generation browsers Netscape 1 and Mosaic. It has not been necessary for many years. <!-- //--> is supposed to signal an HTML comment. Comments should be ignored, not compiled and executed. Also, HTML comments are not to include --, so a script that decrements has an HTML error.
|
|
|
whoisgregg
msg:3193553 | 6:28 pm on Dec 19, 2006 (gmt 0) |
| remove the comment tags in the script |
|
Interesting. I'll uncheck the "Wrap Script in HTML Comment" setting in BBEdit. Thanks for the heads up Fotiman.
|
|
