Skip to main content

Disable Enable textbox using javascript



Introduction:
In this article I am going to explain about the javascript code used for disabling and enabling and also the disadvantages of disabling the textboxes and the alternatives for this.

Explanation:
While programming for security reasons or for some other reasons we supposed to disable certain Textboxes.  For disabling the textbox we have to set the disabled property  to true using javascript. The javascript code for disabling textbox is given below. 

For enabling the textbox we have to set disabled property to false. below  is the code used.


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

But the disadvantage of disabling the textbox is we cann’t get the value of the disaled textbox in code behind. So to avoid this instead of disabling we may make the textbox readonly. So that it is available in code behind. The below code is used for making the textbox as readonly .


document.getElementById('<%=txtReadOnly.ClientID %>').readOnly = "true";


For removing the readonly property of the textbox below code is used.
One for disabling and one for making read only.each text box have a button. If u click the disable button then it will disable the first textbox. If u click the readonly button then it will make the second textbox readonly. After that we have a common button called submit which is used for assigning the textbox values to lables. But in the outbut u may notice that the disabled textbox value is not binded with the label.Full source code is given below.

ASPX code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
    <table>
        <tr>
            <td>
                <asp:TextBox ID="txtdisable" runat="server"></asp:TextBox>
            </td>
            <td>
          <input type="button" value="Disable" id="btnDisable" onclick="fnDisable();" />
            </td>
            <td>
              <asp:Label ID="lblDisable" runat="server" Text=""></asp:Label>
            </td>
        </tr>
        <tr>
            <td>
                <asp:TextBox ID="txtReadOnly" runat="server"></asp:TextBox>
            </td>
            <td>
       <input type="button" value="Readonly" id="btnReadonly" onclick="fnReadOnly();" />
            </td>
            <td>
                <asp:Label ID="lblReadOnly" runat="server" Text=""></asp:Label>
            </td>
        </tr>
        <tr>
            <td colspan="2">
     <asp:Button ID="btnSubmit" runat="server" OnClick="btnSubmit_Click" Text="Submit" />
            </td>
        </tr>
    </table>
</div>
<script type="text/javascript">
    function fnDisable() {
        document.getElementById('<%=txtdisable.ClientID %>').disabled = "true";

    }
    function fnReadOnly() {
        document.getElementById('<%=txtReadOnly.ClientID %>').readOnly = "true";

    }
</script>
</form>
</body>
</html>

CS Code:

protected void btnSubmit_Click(object sender, EventArgs e)
{
    lblDisable.Text = txtdisable.Text;
    lblReadOnly.Text = txtReadOnly.Text;
}


Thus the above code explains the process of disabling textbox and disadvantages and alternatives to that.

Do you like this article. Then comment here or share with your friends. Or like our Facebook page. Or post your comments below

Download Source Code Here

Comments

Post a Comment

Popular posts from this blog

Sort Dictionary Based On Value In Asp.Net And C#.Net | Convert Dictionary into KeyValuePair or KeyValuePair into Dictionary.

In this tutorial i am going to explain about how to sort dictionary object based on value in asp.net and C#.Net or convert unsorted dictionary to sorted dictionary object in C#.Net and VB.Net or Convert Dictionary into KeyValuePair or KeyValuePair into Dictionary.

Code To Convert rupees(numbers) into words using C#.Net

Introduction: In my previous article I have explained about how to validate emailid using javascript . In this article I am going to explain about code used to convert rupees(numbers) into words using C#.Net . Explanation: For explanation purpose I have a page. It has a textbox to input the numbers. And when you click on the convert to words button then it will convert the input numbers into words and shows it in the below label. Below is the C# code used to do this functionality. public static string NumbersToWords( int inputNumber) {     int inputNo = inputNumber;     if (inputNo == 0)         return "Zero" ;     int [] numbers = new int [4];     int first = 0;     int u, h, t;     System.Text. StringBuilder sb = new System.Text. StringBuilder ();     if (inputNo < 0)     { ...

C# code to send mail using smtp from gmail,yahoo mail and live mail

Introduction: In my previous article I have explained about   How to bind/Unbind events in jQuery . In this article I am going to explain about how to send mail from ASP.Net using gmail,yahoomail and live mail credentials. Explanation: First Include the below namespaces in your code behind file. using System; using System.Net; using System.Net.Mail;