title: How to make ASP.NET button call client side javascript and not do postback
body: <p>I have a web app in ASP.NET with a C# code behind.  The main login page is going to have a sort of touchpad type UI where there are buttons for 0-9 to enter a pin #.</p>
  
  <p>So, I'm new to ASP.NET and to JavaScript both.  When these numeric buttons are clicked on the UI, nothing needs to be done on the server side - there shouldn't be any postback at all.  All that needs be done is append a number to a label's text.  I'm trying to figure out how to do that in JavaScript, without the button causing any kind of postback.</p>
  
  <p>To make the example much simpler, let's just say I have a UI with a single label and single button on the screen, and everytime you click this single button, it should append a 1 to the label's text.  Here's my .aspx, but when I try to run this, I get a "Object Expected" exception at runtime...</p>
  
  <p>EDIT: I've modified my example to include the suggestions made in answers below, and still am having issues.  To reproduce, this .aspx code can be copied into the default.aspx of a new VS Web Application project, and run it and click the 1 button; it should append a 1 to the label's value, but it throws an "Object Expected" exception.</p>
  
  <pre><code> &lt;%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestJavascript._Default" %&gt;
  
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  
  &lt;html xmlns="http://www.w3.org/1999/xhtml" &gt;
  &lt;head runat="server"&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;form id="form1" runat="server"&gt;
      &lt;div&gt;
        &lt;asp:Table ID="baseTable" runat="server" HorizontalAlign="Center"&gt;
          &lt;asp:TableRow ID="labelRow" runat="server" HorizontalAlign="Center" Width="100" Height="30"&gt;
            &lt;asp:TableCell ID="labelCell" runat="server" HorizontalAlign="Center" Width="100%" Height="100%" BorderStyle="Solid" BorderWidth="1px"&gt;
              &lt;asp:Label ID="inputLbl" runat="server"/&gt;
            &lt;/asp:TableCell&gt;
          &lt;/asp:TableRow&gt;
          &lt;asp:TableRow ID="buttonRow" runat="server" HorizontalAlign="Center"&gt;
            &lt;asp:TableCell ID="buttonCell" runat="server" HorizontalAlign="Center"&gt;
              &lt;asp:Button ID="btn1" runat="server" Text="1" Height="70px" Width="70px" OnClientClick="btn1Click()"/&gt;
            &lt;/asp:TableCell&gt;
          &lt;/asp:TableRow&gt;
        &lt;/asp:Table&gt;
      &lt;/div&gt;
    &lt;/form&gt;
    &lt;script type="txt/javascript"&gt;
      void btn1Click()
      {
          document.getElementById('&lt;%= inputLbl.ClientID %&gt;').value += "1";
          return false;
      }
    &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any help is much appreciated!</p>