[ACCEPTED]-Disable backspace in textbox via javascript-backspace

Accepted answer
Score: 38

ZX12R was close. This is the correct solution:

The 4 TextBox is like this:

    <asp:TextBox ID="TextBox1" runat="server" onKeyDown="preventBackspace();"></asp:TextBox>

and the script looks 3 like this:

<script type="text/javascript">
    function preventBackspace(e) {
        var evt = e || window.event;
        if (evt) {
            var keyCode = evt.charCode || evt.keyCode;
            if (keyCode === 8) {
                if (evt.preventDefault) {
                    evt.preventDefault();
                } else {
                    evt.returnValue = false;
                }
            }
        }
    }
</script>

First of all, the backspace wont 2 come through on Key Press, so you have to 1 use Key Down.

Score: 8

Can't you just use the HTML readonly="readonly" attribute?

<input type="text" name="country" value="Norway"   readonly="readonly" />

<textarea rows="3" cols="25" readonly="readonly">
It should work! :)
</textarea>

0

Score: 4

How about using a label for the display 2 and a hidden textbox to get the value back 1 to the server?

Score: 2

You need to apply readonly on the client 5 side controller ONLY, so that asp.net doesn't 4 see it and still reads the data on postback. You 3 can do this several ways, one of the easier 2 if you use jQuery is to add a class to the 1 text-boxes eg. cssclass="readonly" in question and $(".readonly").attr("readonly", true);.

Score: 1

As others said ReadOnly="True" will 23 break the postback mechanism.

I believe 22 you can get around it in your code-behind 21 by accessing the Request object directly 20 during PageLoad:

//assuming your textbox ID is 'txtDate'
if(Page.IsPostBack)
{
   this.txtDate.Text = Request[this.txtDate.UniqueID];
}

Your other option is to 19 allow Disabled controls to postback on the 18 form, but this is somewhat of a security 17 concern as readonly fields modified via 16 script could potentially come back:

<form id="MyForm" runat="server" SubmitDisabledControls="True">
..
</form>

http://msdn.microsoft.com/en-us/library/system.web.ui.htmlcontrols.htmlform.submitdisabledcontrols.aspx

I'm not 15 sure the impact of this property on ReadOnly 14 (vs Enabled="False") controls 13 but it's worth trying.

And finally - I did 12 run into the same issue you're having a 11 few years ago, and from what I remember 10 there is a difference between using an html 9 input marked as readonly and runat="server", and 8 an actual serverside control where ReadOnly="true".

I 7 have a feeling doing:

<input type="text" readonly="readonly" runat="server" id="myTextBox" />

may have still allowed 6 the data to come through, although in the 5 code-behind you have to treat the control 4 as a HtmlInputText or HtmlGenericControl 3 vs. a TextBox. You can still access the 2 properties you need though.

Just a few ideas 1 anyway...

Score: 0

here is a possible solution... add an event 3 listener...

<asp:TextBox ID="TextBox1" runat="server" onKeyPress="KeyCheck;" />

and then the function can be 2 like this..

function KeyCheck(e) {
 var KeyID = (window.event) ? event.keyCode : e.keyCode;
 if (KeyID == 8 ) {
    alert('no backspaces!!);
 }
}

doubt if it has to be onkeypress 1 or onkeyup...

Score: 0

ReadOnly attribute does not help. The backspace 2 still is taking your browser to back page 1 even if your text box is read only..

Score: 0

use regular text boxes not read-only and 4 not Disabled, just use client-side JavaScript 3 to ignore keypresses. This will ignore all 2 keypress so you will have your READONLY 1 behaviour and it will also ignore the backspace.

<input type="text" value="Your Text Here" onkeydown="return false;" />
Score: 0

No Need to call any function and all just 1 try this:

<asp:TextBox runat="server" ID="txt" onkeydown="return false;" 
    onpaste = "return false;" onkeypress="return false;" />
Score: 0

I was able to do something similar, with 5 Jquery. Just putting it out here for reference!

$("#inputID").keypress(function (e)
{e.preventDefault();});

$("#inputID").keydown(function (e)
{e.preventDefault();});

the 4 first prevents keypresses, while the second 3 prevents key down events.

Still a JS noob, so 2 feel free to point out good / bad things 1 with this.

More Related questions