CODEWITHSUNDEEP
c#javascriptasp.netinternet-explorer-8master-pages
badpanda
badpanda

Reputation: 2454

Javascript error 'Object doesn't support this property or method' on document.getElementByID?

I am attempting to run this JS function when a user clicks on a Panel (in a TableCell). This Panel is an element in a Content Page, which is used with the Master Page which has a Content Place Holder. When I try to click on the panel, the following error is thrown:

Microsoft JScript runtime error: Object doesn't support this property or method

Here is the relevant code for the Master page ASPX:

       <link rel="Stylesheet" href="../includes/styles.css" />
       <script type="text/javascript" language="javascript">
           function swapDirections(control) {
               var main = document.getElementByID('ct100_TableContent_' + control);
               var long = document.getElementById('ct100_TableContent_' + control + '_long');
               var short = document.getElementById('ct100_TableContent_' + control + '_short');

               var mainhtml = main.innerHTML;
               var longhtml = long.innerHTML;
               var shorthtml = short.innerHTML;

               if (mainhtml.length == shorthtml.length)
                   main.innerHTML = longhtml;
               else
                   main.innerHTML = shorthtml;
           }
        </script>

Here is the relevant code for the Content page:

            Panel rigDirections = new Panel();
            rigDirections.CssClass = "clip";
            rigDirections.ID = u.Id.ToString() + "_RD";
            string MainDivRD = rigDirections.ClientID;
            Literal rigDir = new Literal();
            string sshort = "";
            if (u.RigDirections.ToLower().Length > (textCutOFF + 4))
            {
                sshort = Server.HtmlEncode(u.RigDirections.ToLower().Substring(0, textCutOFF).Trim()) + " ...";
                rigDir.Text = "<a class=RD_RA title=\"Click to Expand\" href=\"javascript: swapDirections('" + MainDivRD + "')\">" + sshort + "</a>"; ;
            }
            else
            {
                sshort = Server.HtmlEncode(u.RigDirections.ToLower().Trim());
                rigDir.Text = sshort ;
            }
            string slong = Server.HtmlEncode(u.RigDirections.ToLower().Trim());

            rigDirections.Controls.Add(rigDir);
            cell.Controls.Add(rigDirections);

And the Content Page ASPX: 

      <asp:Content ID="Content1" ContentPlaceHolderID="TableContent" Runat="Server">

       <asp:Panel ID="pnlTable" Width="950" runat="server">

       </asp:Panel>
      </asp:Content>

The error is being thrown on the first line of the function.

I have exhausted my internet searching skills, and I have never used JS before, so if anyone has any ideas I would greatly appreciate them.

Thanks!

badPanda

Upvotes: 0

Views: 19273

Answers (5)

Pat Grady
Pat Grady

Reputation: 13

You should change getElementID to getElementById. I did this too and couldn't figure it out for days. Just remember that JavaScript is Case Sensitive and uses lowercase CamelCase.

Upvotes: 0

Chandra Sekaran V
Chandra Sekaran V

Reputation: 182

javascript is case sensitive. try document.getElementById instead of document.getElementByID

Upvotes: 3

Dennis
Dennis

Reputation: 32598

Capitalization matters.

document.getElementByID() //wrong
document.getElementById() //right

Upvotes: 6

scottm
scottm

Reputation: 28703

javascript is case sensitive. document.getElementByID() is not a function, but document.getElementById() is.

Upvotes: 8

Senad Meškin
Senad Meškin

Reputation: 13756

It should be document.getElementById not document.getElementByID.

Upvotes: 4

Related Questions