XHTML Strict and input field focus

johngreenwood · 04-08-2007, 01:22 PM

OK, I know this is not programming, but I couldn't think of where else to put this. I am building myself a custom homepage to learn XHTML and CSS. I am trying to to make my Google search box automatically gain focus when the page loads.

I tried this:

Code:

<body onload="document.g.q.focus()">
<form method="get" name="g" action="http://www.google.com/search">
<p><input type="text" name="q" size="31" maxlength="255" value="" />
<input type="submit" value="Google Search" /></p></form>

This worked, but when I put it through the W3C validator, it failed because the "name" attribute is no longer used in XHTML 1.0 Strict.

I also tried to change the name="g" to id="g", as id is supposedly the replacement for name, but it didn't work.

I also tried to use getElementByID(), but if I change name="q" to id="q", the google search doesn't work, and leaves me at Google.com.

Another thing I tries was to give them both the name and id attributes, which also didn't work.

Curiously, if I have "name" in the <form> element, validation fails as name is deprecated in XHTML 1.0 Strict, but "name in the <input> element passes no problem.

taylor_venable · 04-08-2007, 04:41 PM

How about this:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>TEST</title>
  </head>
  <body onload="document.getElementById('q').focus()">
    <form method="get" action="http://www.google.com/search">
      <p>
        <input type="text" id="q" name="q" size="31" maxlength="255" value="" />
        <input type="submit" value="Google Search" />
      </p>
    </form>
  </body>
</html>

OK, so it's not XHTML 1.0 Strict, but it's valid XHTML 1.1 -- which seems better in my opinion, but maybe not what you're going for.

Works right and validates, too.

johngreenwood · 04-08-2007, 06:53 PM

Excellent, thanks very much taylor_venable, it works perfectly.
Now I just need to fill up my popup menus with loads of links.

Thank you again.