CODEWITHSUNDEEP
javascriptasp.net
chenny
chenny

Reputation: 941

Enable/Disable ASP.NET control with javascript

I'm building a page to upload an Excel file on the server for an import operation. So a found a javascript to check the file selected file extension void other file types. Now I'm trying to enable the upload ASP.NET button but javascript returns the error document.getElementById(...) is null.

Here the code:

<script type="text/javascript" language="javascript" defer="defer">
    function enableControl() {
        document.getElementById('button').disable = false;
    }

    function disableControl() {
        document.getElementById('button').disable = true;
    }

    function checkExcelFileUpload(elem) {
        var filePath = elem.value;
        if (filePath.indexOf('.') == -1)
            return false;
        var validExtensions = new Array();
        var ext = filePath.substring(filePath.lastIndexOf('.') + 1).toLowerCase();
        //Add valid extentions in this array
        validExtensions[0] = 'xls';
        //validExtensions[1] = 'pdf';
        for (var i = 0; i < validExtensions.length; i++) {
            if (ext == validExtensions[i])
                return true;
        }
        elem.value = '';
        alert('Sono ammessi solo file di Excel 97-2003');
        return false;
    }
</script>
<asp:FileUpload ID="fileupload" runat="server" size="50" onchange="javascript:try{if(checkExcelFileUpload(this) == true){enableControl();}else{disableControl();}}catch(err){alert(err);};" />
<asp:Button ID="button" runat="server" Text="Upload" Enabled="False" />

I serached on internet and I found other syntax for getElementById but I still have this problem. Can you help me?

Thank you

Upvotes: 4

Views: 33573

Answers (2)

Babak Naffas
Babak Naffas

Reputation: 12561

Option 1 Since your button is a server side control, the rendered ID will be different that what you have specified. Use the following code to generate the ctl$body$button (something along these lines depending on the nesting of your controls).

document.getElementById('<%= button.ClientID %>')

Option 2 If you are using ASP.NET 4, you can use the Static client ID mode.

<asp:Button ID="button" runat="server" ClientIDMode="Static" Text="Upload" Enabled="False" />

See http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx

Upvotes: 6

psantiago
psantiago

Reputation: 714

Instead of: 

document.getElementById('button').disable = false;

You'll probably want:

document.getElementById('<%= this.button.ClientID %>').disabled = false;

Upvotes: 2

Related Questions