CODEWITHSUNDEEP
javascriptjqueryhtml
maloney
maloney

Reputation: 1653

How to disable fields within a Javascript form

What is the best way of disabling(greying out) fields within a Javascript form? I have tried the disabled="disabled" on both the form and its fields but neither work e.g.:

<form:form id="testForm" method="post" disabled="disabled" action="${pageContext.request.contextPath}/testSave" commandName="testForm">
    <tr>
        <td valign="top" disabled="disabled">Name:&nbsp;</td>
        <td valign="top"><form:input disabled="disabled" path="fName"/></td>
    </tr>
</form:form>

Any ideas on what im doing wrong here?

Upvotes: 0

Views: 189

Answers (5)

talemyn
talemyn

Reputation: 7950

Well, it sort of depends on exactly what you are trying to do.

The "sure fire" way of disabling form fields is a combination of "disabled" and "readonly" on the inputs. Between the two, you can cover everything that you could want:

  • grey out the input
  • make the input non-editable
  • make the input non-focasable
  • keep the input from being sent with the form

Since some browsers don't support the "greyed out" part of disabling, the best way to cover that is to set up a custom CSS to display disabled (or readonly) fields the way that you want them to show.

To get the right soluiton for what you want to do with your form, look here for the differences between the two attributes: http://kreotekdev.wordpress.com/2007/11/08/disabled-vs-readonly-form-fields/

Edit: Additionally, you might consider replacing the disabled inputs with text, if the data is not to be sent with the form . . . less confusing to the user than having an input field that they can't use.

Upvotes: 1

vrluckyin
vrluckyin

Reputation: 1024

See the below js sample; I hope my perception matches with your wish:

http://jsbin.com/avopuf/3/

Change css as per your requirement.

Upvotes: 0

user1766760
user1766760

Reputation: 631

Sounds like you can use a reference site to brush up on HTML. I find W3School to be a good starting point, it has tutorials and references for a variety of online technologies.

Specifically for HTML and HTML input tag

Also, how is it not working? (Is it not greying out, or user can still type in it, ...?)

Upvotes: 0

Stokedout
Stokedout

Reputation: 11055

Using JQuery you could do the following to disable all form fields for a given form:

$('#formId').find('input,select,textarea[,other elements]').prop('disabled', true);

Upvotes: 1

devBinnooh
devBinnooh

Reputation: 611

You can disable input tags, but not td

td tag attributes

Upvotes: 0

Related Questions