ASP.NET 4.0 - Accessing Server Controls in Javascript

Posted on 2011-10-18
Last Modified: 2012-05-12
I'm currently converting a web site developed in ASP.NET 2.5 (VB.NET Code) to ASP.NET 4.0 (VB.NET code).

The problem I'm having (that I did not expect) is accessing server side controls through Javascript.

I have an Textbox and ListBox server controls on the web page.

<asp:ListBox ID="lstStore" runat="server"></asp:ListBox>
<asp:TextBox ID="txtCriteria" runat="server">

The following Javascript works in the ASP.NET 2.5 Web Site:

var list = document.getElementById("lstStore");
var txtCriteria = document.getElementById("txtCriteria");


The javascript error I get is "Unable to get the value of the property 'value' on the text box" and "Unable to get the value of the property 'Options' on the list box.

Has something changed with ASP.NET 4.0?  Note:  I do not get any errors on the two 'var' statements.  It is properly identifying the controls on the client side.
Question by:tfewster500

    Author Comment

    Sorry, typo in my sample code.  I am propertly closing the text box tag

    <asp:ListBox ID="lstStore" runat="server"></asp:ListBox>
    <asp:TextBox ID="txtCriteria" runat="server">"></asp:TextBox>

    LVL 81

    Accepted Solution

    try :

    var list = document.getElementById("<%= lstStore.ClientID %>");
    var txtCriteria = document.getElementById("<%= txtCriteria.ClientID %>");

    LVL 7

    Expert Comment

    One thing is your control name should ne within single quotes.
    var list = document.getElementById('lstStore');
    var txtCriteria = document.getElementById('txtCriteria');

    Second thing is you can use HTML control name of both lstStore and txtCriteria.
    [HTML control name you can get it from view source]

    Author Closing Comment

    Awesome this worked.

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Enabling OSINT in Activity Based Intelligence

    Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

    One of the pain points with developing AJAX, JavaScript, JQuery, and other client-side behaviors is that JavaScript doesn’t allow for cross domain request for pulling content. For example, JavaScript code on could not pull conte…
    In an ASP.NET application, I faced some technical problems. In this article, I list them out and show the solutions that I found.  I hope it will be useful. Problem: After closing a pop-up window, the parent page should be refreshed automaticall…
    To add imagery to an HTML email signature, you have two options available to you. You can either add a logo/image by embedding it directly into the signature or hosting it externally and linking to it. The vast majority of email clients display l…
    Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…

    779 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    17 Experts available now in Live!

    Get 1:1 Help Now