Selected a Form text box on load

[Shaun Rigby]

Hi Guys,

I have been doing some research on the internet to find the answer but no
joy.

I have a <form> in my site with a textbox and button which, when submitted,
send the query to Google.

My question is, on form load how do I make this text box automatically
selected so that i can just type without having to select the text box all
the time?

I tried adding an <asp:textbox> and on button click have the value of the
HTML textbox become the value of the ASP textbox, but I think I am doing
things completely wrong.

Please help

Kindest Regards,

Shaun

 

[Mark Rae [MVP]]

Please help

<form id="MyForm" runat="server" defaultfocus="MyTextBox">

 

[Shaun Rigby]

Mark,

When i add the runat="server" tag to the form i receive an error saying that
the document is corrupt

 

[Mark Rae [MVP]]

When i add the runat="server" tag to the form i receive an error saying
that the document is corrupt

Please post your complete markup

 

[Shaun Rigby]

<%@ Page Language="VB" MasterPageFile="~/MasterPage.master"
AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default"
title="Untitled Page" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1"
Runat="Server">
<table border="1" style="width: 100%">
<tr>
<td valign="top" style="width: 50%">
<aspanel ID="Panel1" runat="server" Height="95px"
Width="100%">
<h5 class="headerstyle">Date</h5>
<div class="date">
<asp:Label ID="CurrentDate" runat="server"
Text="Label"></asp:Label>
</div>
</aspanel>
</td>

<td valign="top">
<aspanel ID="Panel4" runat="server" Height="95px"
Width="100%" >
<h5 class="headerstyle">Google Search</h5>
<form action="http://www.google.co.uk/search" method="get"
title="gSearch" target="_blank" defaultfocus="q">
<input type="text" name="q" class="searchbox" /><input
type="submit" name="gSearch" value="Search" id="Submit1" />
<input type="radio" name="meta" value="" />World
Wide<input type="radio" name="meta" value="cr=countryUK|countryGB" />UK
</form>
</aspanel></td>
</tr>

<tr>
<td style="height: 18px">d</td>
<td style="height: 18px">e</td>
</tr>

<tr>
<td style="width: 50%">
g</td>
<td>
h</td>
</tr>
<tr>
<td style="width: 50%">
j</td>
<td>
k</td>
</tr>
<tr>
<td style="width: 50%">
m</td>
<td>
n</td>
</tr>
<tr>
<td style="width: 50%">
p</td>
<td>
q</td>
</tr>
<tr>
<td style="width: 50%">
s</td>
<td>
t</td>
</tr>
<tr>
<td style="width: 50%">
v</td>
<td>
w</td>
</tr>
<tr>
<td style="width: 50%">y</td>
<td valign="top">
<aspanel ID="Panel2" runat="server" width="100%">
<h5 class="headerstyle">BBC Technology RSS Feed</h5>
<aspanel ID="Panel3" runat="server" ScrollBars="Vertical"
Width="100%" Height="75px">
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</aspanel>
</aspanel>
</td>
</tr>
</table>
</asp:Content>




Note: most TD's with a letter are designer generated therefore excuse the
untidy code

 

[Mark Rae [MVP]]

<%@ Page Language="VB" MasterPageFile="~/MasterPage.master"
AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default"
title="Untitled Page" %>

Hmm, right, so you're using MasterPages, and have an HTML form object inside
your content page... That's why you're getting an error when you add
runat="server" because aspx pages can only contain one server-side form
object...

Therefore, it sounds like your only option is to use JavaScript...

At the very bottom of your content page, but still inside the </asp:Content>
tag, try this:

<script type="text/javascript">
document.getElementById('q').focus();
</script>

That's not a particularly elegant or robust solution, but it should work...

 

[Shaun Rigby]

wahay it works,

Thanks Mark

Hmm, right, so you're using MasterPages, and have an HTML form object
inside your content page... That's why you're getting an error when you
add runat="server" because aspx pages can only contain one server-side
form object...

Therefore, it sounds like your only option is to use JavaScript...

At the very bottom of your content page, but still inside the
</asp:Content> tag, try this:

<script type="text/javascript">
document.getElementById('q').focus();
</script>

That's not a particularly elegant or robust solution, but it should
work...