joomla/Component-Builder
joomla
/
Component-Builder
38
19
Fork 11
Code Issues 48 Pull Requests Projects 3 Releases Wiki Activity

Updated 027 How to ensure that a field is not escaped when added to list views (markdown)

Amigo 2019-06-14 14:14:39 +02:00
parent 19e49966d6
commit 55f8329bcf
1 changed files with 24 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
027-How-to-ensure-that-a-field-is-not-escaped-when-added-to-list-views.md

@ -1 +1,24 @@
Hi Sometimes one would like to add extra styling like this [00:00:06](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m06s) Or like that To a listview The problem though is that by Default All of the fields all of these field values are being escaped And so If you would like to add let's say this this kind of styling to a field view Let me show you how I did it In the job order admin View area If you go to PHP [00:00:39](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m39s) There is a method called add PHP getitems method before translation fix and decryption So this happens before The translation or The Fixer or the decryption Sorry the translation fix or the decryption of any field This is not the ideal place you usually would add it after that was done but in this case I did it before So basically I am setting up A value That when I wanna use danger when I wanna use warning Simply using The [00:01:15](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m15s) The getDate and modifying it By the danger time and the warning time from the Job tracking Configuration values so this is a configuration field that I've added to the component and it It's names are warning time and danger time And the default is 3 weeks 1 week And basically this is the date The dates that I would then use I then look through the data And when I identify [00:01:49](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m49s) data that is actually Part of the target I add This Value to it That then intern turns this red Ok And then the next one Is I check the dates And then depending on its values I again add some HTML value [00:02:19](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m19s) To the the date and I use a custom A method in a helper class call fancyDate Where I convert the Default Sequel date to a better date or a better looking date 2nd of April or something Ok So The problem is though [00:02:39](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m39s) If you do this And you Compile your component add items go look at it you'd see that it actually escapes those values and it prints it Out Like a You know like you see it over here It actually prints out That Around The value [00:02:59](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m59s) And that's obviously not what you'd like and the reason why it does that Because all values are being escaped Now there is a way to to stop that from being from happening And that that is really what this tutorial is about To show you how to prevent That escaping So the value we have here is to create date As well as the job status So I'm gonna go in I'm still in the [00:03:31](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m31s) The back end of the component Job order And I'm going to go to the fields And then I'm gonna scroll down to that that value Let 's see where is it now Job status Ok I'm gonna open it And if I then Having a it open and I can scroll down and even here You see that there It doesn't show up here sorry I should actually had it but the reality is [00:04:09](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m09s) way at the bottom you see I added this little line I set escape Equals False So you would simply add this line And then when component Builder compiles It will actually in the body Of the component where that field is loaded It will tell the Escape method not to escape it [00:04:37](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m37s) So that it would then Display the html instead of printing it out So that is really what it's all about maybe it's Got a lot of explanation for such a simple thing But I can tell you what if you can't do that it's quite frustrating because Sometimes you would like to give some indication with some HTML upon the value and then this Feature actually allows that like you could see here We were able to add a nice button around these dates And as well as adding some colour to to these words here and yeah [00:05:15](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m15s) So that is a quick demonstration of how to make use of the not escape Method or concept When it comes to list views around the field values Hope that makes sense You have any questions please don't hesitate to let me know And Until next time take care thanks for watching
# HOW TO ENSURE THAT A FIELD IS NOT ESCAPED WHEN ADDED TO LIST VIEWS
* ### Example Extra styling In Fields
Hi. Sometimes one would like to add extra styling like this [00:00:06](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m06s) or like that to a listview. The problem though is that by default all of these field values are being escaped. And so if you would like to add, let's say this kind of styling to a field view, let me show you how I did it.
### Settings - Editing View - PHP Area
In the job order admin view area, if you go to php, [00:00:39](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h00m39s) there is a method called add PHP(getitems Method - before translation fix & decryption). This happens before the translation fix or the decryption of any field. This is not the ideal place.
### Settings Values In The Code - Add PHP Area
We usually would add it after that was done, but in this case I did it before. I am setting up a value that when I want to use danger, when I want to use warning. Simply using [00:01:15](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m15s) the getDate and modifying it by the danger time and the warning time from the job tracking configuration values. This is a configuration field that I've added to the component and it's names are: warning time and danger time. And the default is 3 weeks, 1 week. This is the dates that I would use.
### Looping Through Data Till Target Found - Adding Styling
I then look through the data and when I identify [00:01:49](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h01m49s) data that is actually part of the target. I add this value to it. That then intern turns this red. The next one is I check the dates. Depending on its values I again add some HTML value [00:02:19](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m19s) to the date, and I use a custom method in a helper class call fancyDate, where I convert the default sequel date to a better date or a better looking date, 2nd of April or something. The problem is though, [00:02:39](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m39s) if you do this and you compile your component, add items, go look at it, you'd see that it actually escapes those values and it prints it out like you see it over here. It prints out that around the value(see video). [00:02:59](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h02m59s)
### Preventing The Escape Info
That's obviously not what you'd like and the reason why it does that, because all values are being escaped. Now there is a way to stop that from being from happening. That is really what this tutorial is about. To show you how to prevent that escaping. The value we have here is to create date, as well as the job status. I'm going to go in, I'm still in the [00:03:31](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h03m31s) back end of the component, Job order.
???
And I'm going to go to the fields, I'm going to scroll down to Job status. I'm going to open it. While I having it open and I can scroll down and you will see that there it doesn't show up here. sorry I should actually add it but the reality is [00:04:09](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m09s) way at the bottom you see I added this little line I set escape Equals False So you would simply add this line And then when component Builder compiles It will actually in the body Of the component where that field is loaded It will tell the Escape method not to escape it [00:04:37](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h04m37s) So that it would then Display the html instead of printing it out So that is really what it's all about maybe it's Got a lot of explanation for such a simple thing But I can tell you what if you can't do that it's quite frustrating because Sometimes you would like to give some indication with some HTML upon the value and then this Feature actually allows that like you could see here We were able to add a nice button around these dates And as well as adding some colour to to these words here and yeah [00:05:15](https://www.youtube.com/watch?v=bfl0l3AoLKU&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h05m15s) So that is a quick demonstration of how to make use of the not escape Method or concept When it comes to list views around the field values Hope that makes sense You have any questions please don't hesitate to let me know And Until next time take care thanks for watching