Question

I am running a c# webpage with html buttoms and am having trouble executing the javascript that enables the dropdown and textboxes. They are all predefined as disabled as well as a ssave button as hidden and on button click I call NewType() function and they should be visible and enabled on button click but its not working. The call for visibility none on the save button works but not for the drop down or textboxes.

<script type="text/javascript">

$(document).ready(function() {
    var d = document.getElementById('saveBtn').style.visibility = 'hidden';

});  

    function NewType() {           
            var e = document.getElementById('saveBtn').style.visibility = 'visible';

            var x = document.getElementById('DD').removeAttribute('disabled');

            var a = document.getElementById('txt1').removeAttribute('disabled');

            var b = document.getElementById('txt2').removeAttribute('disabled');

            var c = document.getElementById('txt3').removeAttribute('disabled');                                                     
        };


 <button type="button" onclick="NewType()">Add New</button>
 <button type="button" id="saveBtn">Save</button>

<select ID="DD" runat="server" disabled="disabled"
                            height="30px" style="width: 120px">
                            <option value=""></option>
                            <option value="1">fruit</option>
                            <option value="2">vegetables</option>       
                                <option value="3">Other</option></select>
   <br />
                      <input size="3" type="text" ID="txt1" runat="server" disabled="disabled" /> 
                      <input size="3" type="text" ID="txt2" runat="server" disabled="disabled"/>
                      <input size="4" type="text" ID="txt3" runat="server" disabled="disabled" />

Answer 1

If you don’t need it, removing the runat="server" attribute from those elements. Controls that have this attribute may be altered before being written to the page. Removing this will mean they are left alone by .NET.

On a plain HTML element, removeAttribute should work.

Here is an example.

<input id="test" type="text" disabled="disabled" value="Some Value">
<script>
    document.getElementById('test').removeAttribute('disabled');
</script>

If you View Source on the page in the browser, you can check to see if .NET has adjusted something, for example the id attribute.

I have tested removeAttribute in the latest versions of Firefox and Internet Explorer.