?
avatar brianpeat
brianpeat
23 Jan 2017

Steps to reproduce the issue

Create a new field of type Checkbox. Add a Value row, and in the Text field add a bootstrap icon span (or i) and class to create an icon. Put whatever you want in the Value field. In my example I used class icon-ok to get a checkbox icon.

Expected result

I expected to see the checkbox icon appear on the front end view of the article after checking the checkbox in the article editor.

Actual result

Instead I can visibly see the check icon rendering next to the checkbox in the article editor, but on the front end, it simply prints the html out.

System information (as much as possible)

3.7 Alpha 1, running on the UX team dev server
(I just realized it was Alpha 1, not 2)

Additional comments

This also brings up some interesting points. If we want Custom fields to be useful without having to resort to overrides or custom css, we might want to add things like rendering html in the label or other entry fields in a custom field. I would also suggest NOT making the label required and when empty, it shouldn't render at all (I may make a new issue for that one). I did try adding an icon class to the field itself, and while this works, the formatting renders it useless as you end up with something like this:
Icon
Label:
Checkbox "Text"

which isn't all that useful.

Again, I'm not nitpicking here, I'm looking for some ways we can make the Custom fields more useful without the need to customize. One scenario I had was the ability to turn on and off some sort of icon, like a Verified check mark.

Feel free to close this if it's a duplicate, or correct me if there's something I'm missing here, or chime in with alternate ideas.

avatar brianpeat brianpeat - open - 23 Jan 2017
avatar joomla-cms-bot joomla-cms-bot - labeled - 23 Jan 2017
avatar brianpeat brianpeat - change - 23 Jan 2017
Title
[com-fields] Checkbox "text" option renders html in edit but not the front end
Checkbox "text" option renders html in edit but not the front end
avatar brianpeat brianpeat - edited - 23 Jan 2017
avatar brianpeat brianpeat - change - 23 Jan 2017
Title
Checkbox "text" option renders html in edit but not the front end
[com-fields] Checkbox "text" option renders html in edit but not the front end
avatar brianpeat brianpeat - change - 23 Jan 2017
Title
[com_fields] Checkbox "text" option renders html in edit but not the front end
[com-fields] Checkbox "text" option renders html in edit but not the front end
avatar brianpeat brianpeat - edited - 23 Jan 2017
avatar brianpeat brianpeat - change - 23 Jan 2017
Title
Checkbox "text" option renders html in edit but not the front end
[com_fields] Checkbox "text" option renders html in edit but not the front end
avatar brianpeat brianpeat - change - 23 Jan 2017
Title
[com-fields] Checkbox "text" option renders html in edit but not the front end
[com_fields] Checkbox "text" option renders html in edit but not the front end
avatar Bakual
Bakual - comment - 23 Jan 2017

Can you add a screenshot of what you put into the checkboxes options? I don't understand it from your description.

avatar brianpeat
brianpeat - comment - 23 Jan 2017

Yeah, after I posted I realized screen shots would help immensely. I'll shoot some now and post them. In the end, this is less about this specific issue and more about trying to make custom fields as useful as possible out of the box before users have to resort to overrides.

avatar brianpeat
brianpeat - comment - 23 Jan 2017

This first image is what happens if you put a space in the label field, and put something (in this case the word Verified) in the "Text" value field and put in "icon-ok" in the render class field.
custom_field_test

You can see it renders the field label wrapper and : symbol, and stacks everything, but you DO get the icon (a check mark).

avatar brianpeat
brianpeat - comment - 23 Jan 2017

This next one was a test of just putting bootstrap icon code into the "text" value field like this:
articles__edit_field_-joomla__3_7-_administration

Again I used a space in the label field. Here's what renders on the front end then:
custom_field_test

But, here's what renders in the article edit on the fields tab:
articles__edit_-joomla__3_7-_administration

Here you can clearly see the admin rendering the check mark code instead of just printing it, and of course since I didn't use a label so there's no label.

On a side note, I'd love to either see label not be required (and not render when empty) or better yet, an option to not show the label for that field when it renders (so you still get a label in the edit screen).

avatar brianpeat
brianpeat - comment - 23 Jan 2017

Here's if I do the same exact thing, but add the word Verified after the icon code I first placed in the text field.

custom_field_test

And here's my browser, modified to remove the field label code and render the icon code properly:
custom_field_test

You can see how handy it would be if the code was rendered and the label could be removed.

avatar brianpeat
brianpeat - comment - 23 Jan 2017

An update to this, the regular text type field also does not render HTML in the field. The text area does, but not the single text field. The reason I bring this up is one COULD use the regular text field, set it to read only, turn off the label (if it was an option) and stick


in the text field and get a nice horiz rule in the output. Currently you can't do that.
This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/13691.

avatar brianpeat
brianpeat - comment - 23 Jan 2017

Here's a link to a related issue I made this morning regarding turning off the label on the front end:

https://issues.joomla.org/tracker/joomla-cms/13707


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/13691.

avatar brianpeat
brianpeat - comment - 23 Jan 2017

One last comment, if we make the text field render html, the "default" field should also render it.

Is this related to the "filter" option? If so, it's clearly not working, or it's saving html but still not rendering it properly.


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/13691.

avatar laoneo
laoneo - comment - 24 Jan 2017

I guess the problem is security as you can put like that HTML into Joomla very easily. But I don't know exactly how the filtering settings of Joomla do come in place. @mbabker any concerns when we remove htmlentities from here https://github.com/joomla/joomla-cms/blob/staging/plugins/fields/checkboxes/tmpl/checkboxes.php#L30?

avatar brianpeat
brianpeat - comment - 24 Jan 2017

On the one hand, you CAN get html using the text editor, but the default editor strips dangerous stuff (whereas JCE has to be set to allow scripts and things). On the other hand, it probably is still a safe thing to scrub it from the basic fields. I was just looking for any creative ways to use the fields without overrides, which could be used to encourage users to try them out.

If my other suggestion gets picked up (ability to turn off the label) at least it's getting close to letting you use a checkbox to turn on an icon since putting the icon class into the render class DOES display it. The only issue then is, it stacks the icon on top of the checkbox output.

avatar brianpeat
brianpeat - comment - 24 Jan 2017

Interestingly enough, if you use UiKit instead of Bootstrap, using an icon class in the render class field DOES render it all inline, it just puts that label in there. I think we can close this, but I'd REALLY love support for this:

https://issues.joomla.org/tracker/joomla-cms/13707

avatar Bakual
Bakual - comment - 24 Jan 2017

To me that sounds like creative hacking of the fields ?
Imho it's a perfect usecase for an override or even a copy of the respective field plugin (which can be reused across sites).

avatar brianpeat
brianpeat - comment - 24 Jan 2017

The problem is, I was given the task by the UX team to come up with some real world scenarios WITHOUT overrides. So I was trying some creative ways someone might try to use them without an override. I can't even resort to custom css for these. :)

avatar brianpeat brianpeat - change - 25 Jan 2017
Status New Closed
Closed_Date 0000-00-00 00:00:00 2017-01-25 03:36:57
Closed_By brianpeat
avatar brianpeat brianpeat - close - 25 Jan 2017
avatar brianpeat
brianpeat - comment - 25 Jan 2017

Going to close this as honestly I'm probably the only person who will ever try this. ha!

Add a Comment

Login with GitHub to post a comment