Workaround: ensure saving disabled form fields to an XPages document

Monday, February 24, 2014 at 7:18 PM UTC

Today I got a discussion response to my OpenNTF projekt "FileSilo" regarding the readers and authors fields in a file collection (http://www.openntf.org/main.nsf/project.xsp?r=project/FileSilo/discussions/BDE4046AFC35F4B486257C890055DB97).

In the collection form I defined two fields as "disabled" using custom attributes. I chose the "disabled" to get a non -editable field in edit mode as those fields must not be filled by the user directly but only with the namepicker.

Ingo Weidinger discovered a problem (thank you!): the disabled items are not stored in the document (for sure). I admit that I never tested that after that change (shame upon me) but: hail to the users of OpenNTF this problem was found! And now I show you a solution to somewhat "simulate" the "disabled" experience to a field in your form without getting into trouble.

The "ingredients" are:

  • jQuery
  • CSS
  • some knowledge of using CSS classes

If you are using Bootstrap (in this case I do for this application) you are already using jQuery for sure. So you can achieve the disired behavior of a disabled field not to be focused by adding this to your Javascript (e.g. in the document.ready function):

$(document).ready(function(){

$(".disabled").focus(function(){

$(this).blur();

})

})

I assume the "disabled" field to have the CSS class "disabled" applied:

<xp:inputText value="#{document1.fileReaders}" id="fileReaders1"
multipleSeparator="," multipleTrim="true" styleClass="form-control disabled">
</xp:inputText>

This prevents the cursor to be set into the field (even with TAB).

Now to the styling: add this to your CSS to get the native styling from Bootstrap for disabled fields:

.disabled {

background-color: #eee;
cursor: not-allowed;

}

As these tweaks are only CSS/JS-based the field will be stored in the document as it does not have the "real" disabled attribute.

For my files I stored this one in my OSnippets section as well: http://mardou.dyndns.org/Privat/osnippets.nsf/id/JUND-9GMRL2






Latest comments to this post

Oliver Busse wrote on 13.04.2016, 21:36

To be honest: I never tried that. Radio buttons use a different renderer when in read mode.

 Link to this comment
Ryan wrote on 13.04.2016, 20:40

Thanks for the idea. I've been using this. However, it doesn't appear that this works for a Radio Button or a Radio Button Group. Have you come across this or have any ideas to workaround this?

 Link to this comment

Leave a comment right here