CODEWITHSUNDEEP
jqueryhtmlcss
Craig
Craig

Reputation: 3102

HTML just cannot get focus instead of disabled

I am currently trying to see if there is a way to not disable an input but not allow the input to get focus. I am doing this because I still need the backend to retrieve the data but just not allow the user to certain times to edit the input fields. Since disabled doesn't return data to the backend that doesn't work. The way I am currently doing it, is when the user presses submit I remove the disabled attribute however this makes them appear normal for a few seconds before the next page loads. Any suggestions would be great (my next step is going to be adding the 

background-color: #F2F2F2 !important;
color: #C6C6C6;
border-color: #ddd;

But since each browser does it differently I would prefer a solution that doesn't do this.

Upvotes: 0

Views: 610

Answers (3)

bobince
bobince

Reputation: 536379

Consider using readonly, which is meant for exactly this sort of thing.

<input type="text" name="foo" readonly>
<input type="text" name="foo" readonly="readonly"/> <!-- XHTML syntax -->

document.getElementsByName('foo')[0].readonly= true;

A readonly field can be focused so the user can still eg. select and copy text out of it. But it can't be edited, and the rendering may look semi-disabled.

Upvotes: 1

Robert
Robert

Reputation: 21388

Just intercept the onfocus event and send a blur() event, that way, if anyone focuses on it, the input is immediately unfocused.

​document.getElementById('input').onfocus = function() { this.blur(); }​​​​​

Here's an example
http://jsfiddle.net/HkbTH/

Upvotes: 1

mfeingold
mfeingold

Reputation: 7154

Disable the input and add another input type=Hidden with the same name

Upvotes: 2

Related Questions