Bug: No text selection w/ setCanSelectText(true) & ReadOnlyDisplayAppearance.DISABLED

[Blama]

Hi Isomorphic,

please see this sample based on BuiltInDS:

BuiltInDS.java

package com.smartgwt.sample.client;

import com.google.gwt.core.client.EntryPoint;
import com.smartgwt.client.core.KeyIdentifier;
import com.smartgwt.client.data.Criteria;
import com.smartgwt.client.data.DataSource;
import com.smartgwt.client.types.ReadOnlyDisplayAppearance;
import com.smartgwt.client.util.PageKeyHandler;
import com.smartgwt.client.util.Page;
import com.smartgwt.client.util.SC;
import com.smartgwt.client.widgets.IButton;
import com.smartgwt.client.widgets.events.ClickEvent;
import com.smartgwt.client.widgets.events.ClickHandler;
import com.smartgwt.client.widgets.form.DynamicForm;
import com.smartgwt.client.widgets.layout.VLayout;

public class BuiltInDS implements EntryPoint {
	private DynamicForm boundForm;
	private IButton toogleBtn;

	public void onModuleLoad() {
		KeyIdentifier debugKey = new KeyIdentifier();
		debugKey.setCtrlKey(true);
		debugKey.setKeyName("D");

		Page.registerKey(debugKey, new PageKeyHandler() {
			public void execute(String keyName) {
				SC.showConsole();
			}
		});

		VLayout vLayout = new VLayout(10);
		DataSource ds = DataSource.get("animals");
		boundForm = new DynamicForm();
		boundForm.setCanEdit(true);
		boundForm.setReadOnlyDisplay(ReadOnlyDisplayAppearance.READONLY);
		boundForm.setCanSelectText(true);
		boundForm.setDataSource(ds);
		boundForm.fetchData(new Criteria("scientificName", "Loxodonta africana"));

		toogleBtn = new IButton("Toggle disabled");
		toogleBtn.addClickHandler(new ClickHandler() {
			public void onClick(ClickEvent event) {
				if (boundForm.getCanEdit()) {
					boundForm.setCanEdit(false);
					if (boundForm.getReadOnlyDisplay() == ReadOnlyDisplayAppearance.DISABLED) {
						boundForm.setReadOnlyDisplay(ReadOnlyDisplayAppearance.READONLY);
						boundForm.setCanSelectText(true);
						SC.say("ReadOnlyDisplayAppearance.READONLY");
					} else {
						boundForm.setReadOnlyDisplay(ReadOnlyDisplayAppearance.DISABLED);
						boundForm.setCanSelectText(true);
						SC.say("ReadOnlyDisplayAppearance.DISABLED");
					}
				} else
					boundForm.setCanEdit(true);
				boundForm.markForRedraw("Toggled canEdit");
			}
		});

		vLayout.setMembers(boundForm, toogleBtn);
		vLayout.draw();
	}
}

animals.ds.xml

<DataSource ID="animals" serverType="sql" tableName="animals" testFileName="animals.data.xml">
	<fields>
		<field name="commonName" title="Animal" type="text" />
		<field name="scientificName" title="Scientific Name" type="text" primaryKey="true" required="true" />
		<field name="lifeSpan" title="Life Span" type="integer" />
		<field name="status" title="Endangered Status" type="text">
			<valueMap>
				<value>Threatened</value>
				<value>Endangered</value>
				<value>Not Endangered</value>
				<value>Not currently listed</value>
				<value>May become threatened</value>
				<value>Protected</value>
			</valueMap>
		</field>
		<field name="status2" title="Endangered Status ComboBoxItem" nativeName="status" type="text" editorType="ComboBoxItem">
			<valueMap>
				<value>Threatened</value>
				<value>Endangered</value>
				<value>Not Endangered</value>
				<value>Not currently listed</value>
				<value>May become threatened</value>
				<value>Protected</value>
			</valueMap>
		</field>
		<field name="diet" title="Diet" type="text" />
		<field name="information" title="Interesting Facts" type="text" length="1000" />
		<field name="picture" title="Picture" type="image" detail="true" imageURLPrefix="/isomorphic/system/reference/inlineExamples/tiles/images/" />
	</fields>
</DataSource>

As you can see, it is not possible to select text when in ReadOnlyDisplayAppearance.DISABLED-mode. I don't think it should be this way.

Additionally in ReadOnlyDisplayAppearance.READONLY-mode, the text of field "Endangered Status" (SelectItem, <div>-based) is not selectable, while the text of the same-looking field "Endangered Status ComboBoxItem" (ComboBoxItem, <input>-based) is selectable.

Best regards,
Blama

[Isomorphic]

Selection is always disallowed on disabled form items. Being disabled means the item has no interactivity with the mouse.

For the other readOnly appearances, we actually agree that it would make sense to allow text selection in all items.
We've made a change to allow this in mainline (5.0d) only.

For 4.1p you'll need to explicitly call 'setCanSelectText(true)' on the item to allow text selection at the same time as calling setCanEdit(false)

Regards
Isomorphic Software

[Blama]

Hi Isomorphic,

thanks for the update. The Selection-change is not that important for me (especially when there is a workaround), 5.0d is fine.

Could you explain the difference between

1. setCanEdit(false) + ReadOnlyDisplayAppearance.DISABLED
2. setDisabled(true)

Best regards,
Blama

[Isomorphic]

There isn't really a difference in terms of behavior or appearance.
When you set canEdit to false and readOnlyDisplay is set to "disabled", "isDisabled()" will return true for the item, so we render out a fully disabled item.
The difference is that the disabled appearance and behavior is being driven by the "canEdit" state, not by the orthogonal "disabled" state - so calling "setDisabled(false)" on either the form or the item will not make the item truly enabled when in this state -- you need to also have canEdit set to true.


Regards
Isomorphic Software

[Blama]

Selection is always disallowed on disabled form items. Being disabled means the item has no interactivity with the mouse.

I just found out that this is not true for SelectItems, ComboBoxItems and LinkItems. In ReadOnlyDisplayAppearance.DISABLED mode + explicitly set setCanSelectText(true) in every FormItem-subclasses' setDefaultProperties(), I can select for these (only these, not e.g. TextItem, TextAreaItem). See screenshot.

I really like this. If you are going to make the behaviour consistent in ReadOnlyDisplayAppearance.DISABLED-mode, please consider changing the other items to this behaviour and not to change these.

Best regards,
Blama