DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Newsletter
Log In / Join
Refcards Trend Reports
Events Video Library
Refcards
Trend Reports

Events

View Events Video Library

Related

  • Build a Dynamic Web Form Using Camunda BPMN and DMN
  • Automating a Web Form With Playwright MCP and MySQL MCP
  • Exploring Intercooler.js: Simplify AJAX With HTML Attributes
  • Dynamic Web Forms In React For Enterprise Platforms

Trending

  • PWA on iOS, Part 2: HTTPS, Manifest and Service Worker
  • Closing the Drift Loop: An AI Agent That Drafts Terraform Fixes
  • Applying Microservices Lessons to Multi-Agent AI Systems
  • Genkit Flows as senro Steps: Extremely Powerful AI Pipelines in Go

Draft This article hasn't been published, so readers can't see it.

In moderation This article is waiting for review, so readers can't see it yet.

Deleted This article has been deleted, so readers can't see it.

HTML/JSP Disabled Form Field's Strange Behavior

This post will show you how to generate disabled field behavior for any of the input fields in HTML. Read on to learn more.

By 
Shidram BJ
·
Jan. 09, 16 · Tutorial
Post on X (opens in a new tab) Share on LinkedIn (opens in a new tab)
23.3K Views

Join the DZone community Save articles, join the discussion, and download Refcards and Trend Reports with a free account.

Join for free Already a member? Log in

Disabled Form Fields of HTML Will Not Get the Values (Null) After Submitting the Form

Using the code below for the input form fields in HTML will generate the disabled field. The disabled field is the one which is not editable, not focusable, won’t get tab navigation, and can’t select the field. We can apply this attribute on all input fields, buttons, select box, etc. 

Please see the code below:

<input type=”text” name=”accountNumber” value=”123455” disabled=”disabled”   />

This will generate the disabled text field where we are unable to edit and select the field.

Characteristics of Disabled Form Fields

  1. Disabled form field cannot be focusable, i.e., you cannot focus the field. 
  2. Disabled fields are non-editable.
  3. Disabled fields will not be submitted when submission of the form happens or when we click on the Submit button.
  4. Disabled fields will give null values after submitting the form where you are getting the values (it may be struts action class in case of struts or servlet class in case of servlets).
  5. We can modify the values of disabled fields only through JavaScript at the client side.

How to Get Disabled Behavior for Any of the Input Fields and Get the Non-null Values After Form Submission

  1. Make the field readOnly instead of disabled  by putting the attribute as readonly=”readonly” for html fields and readOnly=”true” for struts JSP fields.
  2. Prepare the CSS with the color of disabled fields (i.e. gray color), and apply the CSS to the fields which you made as readonly. Now the field is uneditable because of the readonly attribute and looks like the disabled field because of the CSS applied.

Characteristics of readonly Fields

  1. Fields are not editable through the screen.
  2. Fields can be modified through JavaScript code at client side.
  3. Fields can be Focusable.
  4. Fields can be selectable.
  5. Tab navigation is possible on the fields.
  6. Values can be submitted after form submission.
  7. There are no null values after form submission whenever the field contains values while submitting.

This will solve the issue with disabled fields used in the view layer for a specific purpose and will help to get the disabled behavior.

For other posts please visit my blog : Journey Towards Java


Form (document)

Published at DZone with permission of Shidram BJ. See the original article here.

Opinions expressed by DZone contributors are their own.

Related

  • Build a Dynamic Web Form Using Camunda BPMN and DMN
  • Automating a Web Form With Playwright MCP and MySQL MCP
  • Exploring Intercooler.js: Simplify AJAX With HTML Attributes
  • Dynamic Web Forms In React For Enterprise Platforms

Partner Resources

×

Comments

Loading comments

The comments didn't load

Please try again in a moment.

Likes

Loading

The next likes didn't load. Please try again.

The likes didn't load

Please try again in a moment.

See who liked this

Log in or join DZone for free to see who liked this article.

Log in Join for free
  • RSS
  • X
  • Facebook

ABOUT US

  • About DZone
  • Support and feedback
  • Community research

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Core Program
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 3343 Perimeter Hill Drive
  • Suite 215
  • Nashville, TN 37211
  • [email protected]

Let's be friends:

  • RSS
  • X
  • Facebook