joomla-cms icon indicating copy to clipboard operation
joomla-cms copied to clipboard

[4.0] Add Before and After texts to Number field

Open shur opened this issue 4 years ago • 12 comments

The Number field is a very commonly used field in various Joomla settings. It seems to me that this field really lacks one important element: the ability to write a unit of measurement (but not only that).

If you look at another field - Text. This field has the option to add Before and After texts. This PR implements the same functionality for Number fields. So now you can easily add (minutes, seconds, symbols, px, etc.)

What is it for?

If you look where this field is used now, it becomes obvious that these features were sorely lacking: field-number-occurs

Real use example

And here is an example of how I use this field in my RAXO news module. To me, it looks good and informative, so I decided to share. raxo-module-image-settings

Testing Instructions

Open any manifest file where the Number field is used and try to add new parameters:

addonBefore="text" 
addonAfter="text"

For example, you can check how it works in the standard Articles - Category module: /modules/mod_articles_category/mod_articles_category.xml

	<field
			name="introtext_limit"
			type="number"
			label="MOD_ARTICLES_CATEGORY_FIELD_INTROTEXTLIMIT_LABEL"
			default="100"
			filter="integer"
			showon="show_introtext:1"
			addonAfter="characters"
		/>

shur avatar Jan 06 '21 14:01 shur

unfortunately when accessed by a screenreader or similar the unit is only announced after the input has been completed. This is a major reason why you never see inputs like this

brianteeman avatar Jan 06 '21 14:01 brianteeman

@brianteeman unfortunately when accessed by a screenreader or similar the unit is only announced after the input has been completed. This is a major reason why you never see inputs like this

workaround should be possible? sr-only something like that?

HLeithner avatar Jan 06 '21 15:01 HLeithner

That would work only for a screenreader. Input labels should not be split and ideally frontloaded. That's why you rarely see this design

brianteeman avatar Jan 06 '21 15:01 brianteeman

is reordering possible? for people without accessibility problems this looks much better and intuitive.

@shur can you please keep alphabetical ordering for variables assignment and switch statement, that's maybe not logical from technical point of view but better readable I think also reduces the noise of the pr.

Beside that you have to rebase this PR on 4.1 because 4.0 is in feature freeze.

HLeithner avatar Jan 06 '21 15:01 HLeithner

These add-ons are optional, but their presence makes it possible to apply them where necessary.

Bootstrap v5 Input group: https://getbootstrap.com/docs/5.0/forms/input-group/

shur avatar Jan 06 '21 15:01 shur

@shur can you please keep alphabetical ordering for variables assignment and switch statement, that's maybe not logical from technical point of view but better readable I think also reduces the noise of the pr.

ок

shur avatar Jan 06 '21 15:01 shur

These add-ons are optional, but their presence makes it possible to apply them where necessary.

Bootstrap v5 Input group: https://getbootstrap.com/docs/5.0/forms/input-group/

Not sure why you posted that link other than to confirm that your proposal is not a normal design pattern

brianteeman avatar Jan 06 '21 16:01 brianteeman

This is a major reason why you never see inputs like this That's why you rarely see this design

@brianteeman This approach is not that rare as you say. I have provided the link to Bootstrap docs (one of the most popular frameworks) so people could see the same approach.

Not sure why you posted that link other than to confirm that your proposal is not a normal design pattern

This is where you are wrong. This is definitely not my field design idea. I can only write again that this pull request copies similar functionality from another field - Text. That is, this approach is ALREADY used in the Joomla 4 admin panel (e.g. Content > Media > Media Edit )

Therefore, I do not really understand your claims.

content-media-media-edit

Moreover, the suggestion I've made is just additional text for Number field. It won't impact the current Joomla functions, it's just a possibility that you may use it when needed or may not use it at all.

For example in third-party extensions. Or, for example, to specify the caching time, since the Joomla admin uses both minutes and seconds in different admin parts. In Joomla 4 there are no tooltips, no description for many fields, so how do you expect users (especially newbies) to understand units of measurement. I'd like to see Joomla admin panel intuitive and user-friendly.

shur avatar Jan 06 '21 19:01 shur

This is outdated per Bootstrap 5.

Dropped .input-group-append and .input-group-prepend. You can now just add buttons and .input-group-text as direct children of the input groups.

Quy avatar Mar 15 '21 17:03 Quy

@shur are you still working on this PR?

drmenzelit avatar Dec 29 '21 10:12 drmenzelit

This pull request has automatically rebased to 4.2-dev.

HLeithner avatar Jun 27 '22 13:06 HLeithner

This pull requests has been automatically converted to the PSR-12 coding standard.

joomla-bot avatar Jun 27 '22 21:06 joomla-bot

Thanks for this very useful feature. As this pull request got outdated, I'm closing it. When it is ready for review, please reopen it so we can get some tests and finally merged.

laoneo avatar Oct 21 '22 11:10 laoneo