Why is making a textbox read only in javascript so difficult

[Tim]

Hi

I am simply trying to set a textbox to readonly on a client side button click.

I have seen examples that mention getting the _textBoxElement, but that doesn't work.
Or I should say attempting to use that mechanism says _textBoxElement isn't supported
on the client side object I have.

Here is my script:

var

 

 

tbConnectionName = document.getElementById( "ConnectionNameTextBox" );

 

 

 

var cbInitiate = document.getElementById( "InitiateConnectionCheckBox" );

 

 

 

var tb = $telerik.toTextBox( tbConnectionName );

 

 

 

//tb._textBoxElement.readOnly = true;

 

 

 

var e = tb.get_element;

 

 

tbConnectionName.readonly =

 

true;

 

cbInitiate.disabled = bDisabled;

Disabling the cbInitiate object works fine, but none of my attempts to set readonly
on the tbConnectionName object have been successful.

BTW here is the corresponding HTML:

 

 

 

<div style="width:85%; float:right;">

 

 

 

 

<telerik:RadTextBox

 

 

 

ID="ConnectionNameTextBox"

 

 

 

ClientIDMode="Static"

 

 

 

MaxLength="80"

 

 

 

runat="server"

 

 

 

Width="300px" TabIndex="4" />

 

 

 

</div>

 

 

 

<div style="width:85%; float:right;">

 

 

 

 

<asp:CheckBox ID="InitiateConnectionCheckBox" runat="server"

 

 

 

AutoPostBack="True"

 

 

 

AccessKey="I"

 

 

 

ClientIDMode="Static"

 

 

 

OnCheckedChanged="InitiateConnectionCheckBoxClicked"

 

 

 

TabIndex="5" Text="Initiate a connection if not already connected" />

 

 

 

</div>

 

Right now I am considering maing an Ajax request in my onclick event and setting
the property in server side code. We can set ReadOnly quite successfully all over the place in server side code. Doing this seems excessive though.

Any help greatly appreaciated.

[Vasil]

Hi Tim,

The RadInput with EnableSingleInputRendering set to true uses the same ID for the input element as the control's ClientID.

<telerik:RadTextBox runat="server" ID="RadTextBox1">
</telerik:RadTextBox>
<script type="text/javascript">
  function makeReadonly()
  {
    $get("<%=RadTextBox1.ClientID %>").readOnly = true;
  }
</script>
<input type="button" value="make the input readonly" onclick="makeReadonly(); return false;"" />

Note that changing the readonly of a input ClientSide will not change it's server read-only property. So if you want the server control to be really read only you need to do it from the code-behind.

All the best,
Vasil
the Telerik team