[whatwg] [WF2] <select required>
Robert
mail at robbiegee.com
Tue Oct 3 16:35:27 PDT 2006
On Mon, 02 Oct 2006 16:35:32 +0200, Simon Pieters <zcorpan at hotmail.com>
wrote:
> I've seen a case where a <select> is used and the user is required to
> change its value, as in:
>
> <select name="test" required>
> <option value="">Select one:
> <option>Foo
> <option>Bar
> </select>
>
> Now this can be done with radio buttons instead, but why can't the above
> be supported? That is, make required apply to <select>s and if the value
> is empty then required is not satisfied. (Same for <select multiple>.)
Submitting an empty value may be wanted, and since a select by definition
is a list of predefined valid values, it would make little sense to
prevent the user from selecting some of them. However, I agree with the
use case of the invalid starter value so users must consciously select a
value they wanted instead of the default one.
The following script will do exactly what you wanted, although Opera
doesn't seem to use the custom error message for some reason. I'm not sure
if that's my fault or Opera's due to my lack of experience with WF2, but
it does prevent form submissions just fine as long as there are invalid
selects.
The script works in Opera 9.02.
<script type="text/javascript"><![CDATA[
function checkSelect(e){
var test = e.target;
if(e.target.value == '')
e.target.setCustomValidity('You must select a value.');
else
e.target.setCustomValidity(null);
}
// Use '//select' for html documents, or use a wrapper function
// that strips namespace prefixes for plain 'ol html.
var res = document.evaluate('//html:select',document,
function(pfx){return 'http://www.w3.org/1999/xhtml';},4,null);
var elem=null;
while(elem = res.iterateNext()){
if(!elem)break;
checkSelect({'target':elem}); // do initial check
elem.addEventListener('change',checkSelect,false);
}
]]></script>
--
Robert Græsdal
More information about the whatwg
mailing list