SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    Sep 2010
    Posts
    111
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Read only Textbox

    In jQuery how do you make a textbox read only and how do you turn it back.

    This is what I tried:

    Code:
    $("#<%= TextBox1.ClientID %>").readonly();

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,352
    Mentioned
    179 Post(s)
    Tagged
    9 Thread(s)
    Hi there,

    You set the readonly attribute to true to make the input field read only.
    You can use removeAttr to remove it, or set it to false.

    Here's a small example:

    HTML Code:
    <!DOCTYPE HTML>
    <html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Read only textbox example</title>
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
      </head>
      
      <body>
        <div>
          <input type="text" id="myTextBox" value="Well, hello there!" />
        </div>
        <button id="myButton">Make read-only</button>
        
        <script>
        $(document).ready(function() {
          var t = $("#myTextBox");
          var b = $("#myButton");
          
          b.on("click", function(){
            if (t.attr('readonly')){
              t.removeAttr('readonly');
              b.text("Make read-only");
            } else {
              t.attr('readonly', true);
              b.text("Remove read-only");
            }
          });
        });
        </script>
      </body>
    </html>

  3. #3
    SitePoint Zealot
    Join Date
    Sep 2010
    Posts
    111
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanx exactly what i needed.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •