Enable asp button only when there is text in the asp textbox

Ok, so I have a multiple ASP textboxes and ASP buttons on a page within a multiview. The submit button associated with each textbox should be enabled only when there is text entered in the textbox. So, I wrote a Javascript function to handle this and I'm getting an error saying "document.getElementById(...)' is null or not an object"

    function checkEmptyTxtBox(val, savebtn) {
        if (val.value.replace(/^\s+|\s+$/g, "") == "")
            document.getElementById(savebtn).disabled = true;
        else
            document.getElementById(savebtn).disabled = false;
    }

                   <asp:TextBox 
                    ID="txt_Comments_2" 
                    runat="server" 
                    Wrap="true" 
                    TextMode="MultiLine" 
                    onkeyup="checkEmptyTxtBox(this,'<%= btnSave2.ClientID %>')">
                 </asp:TextBox>

                 <asp:B开发者_Python百科utton 
                    ID="btnSave2"
                    runat="server"
                    text="Save" 
                    Enabled="False"/>

This is on VS2010.

You cannot set an attribute of a Server Side Control using <%= %>. If you look at the rendered source, it looks like this:

 onkeyup="checkEmptyTxtBox(this,'<%= btnSave2.ClientID %>')"

It literally contains the <%= %>.

You could set the attribute on page load like this:

protected void Page_Load(object sender, EventArgs e)
{
    txt_Comments_2.Attributes["onkeyup"] = "checkEmptyTxtBox(this,'" + btnSave2.ClientID + "')";
}

EDIT:

As many will be willing to point out; this isn't really the "best" way to do event registration in HTML. Rather, the JavaScript should bind to the keyup event by adding an event listener. For example, with jQuery it becomes:

$(document).ready(function() {
    $('#<%: txt_Comments_2.ClientID %>').keyup(function() {
        if ($(this).val().replace( /^\s+|\s+$/g , "") == "") {
            $('#<%: btnSave2.ClientID %>').attr('disabled', 'disabled');
        }
        else {
            $('#<%: btnSave2.ClientID %>').removeAttr('disabled');
        }
    });
});

And your ASP.NET markup looks like this:

<asp:TextBox 
    ID="txt_Comments_2" 
    runat="server" 
    Wrap="true" 
    TextMode="MultiLine" />

<asp:Button 
    ID="btnSave2"
    runat="server"
    text="Save" 
    Enabled="False"/>

This has the advantage of not cluttering your HTML with event registration. There are even other, perhaps cleaner ways of doing this with something like KnockoutJS.

This might be because the ID of your button is btnSave2 but you're passing <%= btnSave2.ClientID %> as the savebtn. Javascript cannot find the element by the id which you specified.

Also, I just read up on people who have had a similar issue and theirs was that they did not do a RegisterStartupscript.

Please check these out:

http://forums.asp.net/t/1160208.aspx/2/10?document+getelementbyid+is+null+or+not+an+object http://msdn.microsoft.com/en-us/library/asz8zsxy.aspx