CODEWITHSUNDEEP
javascriptjqueryasp.net
windowsgm
windowsgm

Reputation: 1616

Disabling Controls

I'm trying to disable some controls on my Aspx page but can't get it working. I've tried both Javascript and JQuery so I know I must be doing something simple wrong.

Here's what I have atm and I know that it's definitely entering both functions when I want them to because I've stuck in alerts to tell me so. However the controls remain enabled always!

<script language="javascript" type="text/javascript">

function fun1(){
var input = $('#txtDocs');
input.removeAttr('disabled');
}

function fun2() {
var input = $('#txtDocs');
input.attr('disabled', 'disabled');
}

And the control itself;

<p>
<asp:TextBox ID="txtDocs" runat="server"  Width="218px" 
      Height="75px" TextMode="MultiLine" MaxLength="40"/>
</p>

I've also tried swapping out the code in both functions for various versions of the following;

document.getElementById("txtDocs").enabled = true;
document.getElementById("txtDocs").attributes.enabled = true;
document.getElementById("txtDocs").disabled = false;

No good though. What am I doing wrong?

UPDATE

current code;

function fun1(){
alert("1 enable");
$('#txtDocs').removeAttr('disabled');
alert("2 enable");
}

function fun2() {
alert("1 disable");
$('#txtDocs').prop('disabled', true);
alert("2 disable");
}

<asp:TextBox ID="txtDocs" runat="server"  Width="218px" ClientIDMode="Static"
      Height="75px" TextMode="MultiLine" MaxLength="40"/>

Still no good :/ I'm only seeing alert("1 disable"), alert("1 enable") and alert("2 enable") so not getting through fun2...

NOTE

Debugged into my code and just noticed that during run time my Textbox is actually a Textarea. Any significance? Also it's ID will have the usual "ctl00_MainContentPlaceHolder_" tagged onto the start.

Upvotes: 0

Views: 239

Answers (6)

windowsgm
windowsgm

Reputation: 1616

Cannot really explain it but after spending ages trying everything here and everything I could find on the net, referencing my object like so worked;

document.getElementById('ctl00_MainContentPlaceHolder_txtDocs').disabled = false;

Note the lack of # before the ID. Also, I did not need the ClientIDMode as I put "ctl00_MainContentPlaceHolder_" before my ID.

Upvotes: 0

user1499112
user1499112

Reputation:

Mark Up

You are missing ClientIDMode...

<asp:TextBox ID="txtDocs" runat="server" Width="218px" 
  ClientIDMode="Static" Height="75px" TextMode="MultiLine" MaxLength="40" />

JavaScript

document.getElementById('IdOfTheTextbox').disabled = true/false;

You FireBug instead to scan the issue closely

Upvotes: 0

Bazzz
Bazzz

Reputation: 26922

Your TextBox ID "txtDocs" does not end up on the client like that, so javascript cannot find an element with id="txtDocs" You need to set the ClientIDMode attribute on your TextBox control to Static:

<asp:TextBox ID="txtDocs" runat="server" Width="218px" ClientIDMode="Static" 
   Height="75px" TextMode="MultiLine" MaxLength="40" />

Upvotes: 0

Evan
Evan

Reputation: 6115

it looks like you should be doing:

input.attr('disabled', true); // to disable

input.removeAttr('disabled'); // to enable

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

disabled is a binary property, not an attribute, so you need to use:

$('#txtDocs').prop('disabled','disabled');
$('#txtDocs').removeAttr('disabled');

Upvotes: 1

wirey00
wirey00

Reputation: 33661

You should be using prop() if you're using jQuery 1.6+

$('#txtDocs').prop('disabled',true);
$('#txtDocs').prop('disabled',false);

Acoording to jQuery docs http://api.jquery.com/prop/

The .prop() method should be used to set disabled and checked instead of the .attr() method.

Upvotes: 3

Related Questions