From da3a5e31c29f1160762a124f6ca37a6838a317ec Mon Sep 17 00:00:00 2001 From: Amigo <49749100+aamigo@users.noreply.github.com> Date: Tue, 21 May 2019 11:54:16 +0200 Subject: [PATCH] Updated 006 Basic Fields (markdown) --- 006-Basic-Fields.md | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/006-Basic-Fields.md b/006-Basic-Fields.md index 98bdd62..30ae2fb 100644 --- a/006-Basic-Fields.md +++ b/006-Basic-Fields.md @@ -20,9 +20,16 @@ So that's how to create a text field. You can target these text fields with CSS So this is primarily targeting your admin area with these scripts. Although you can extend the the editing one, which is the single view, to the front, which means it will also extend that to the front. [00:15:10](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m10s) The way to target this field would be: that is the ID plus jform. If you forget that, you could look at any other field and you'd see it says jform_ and then the field name as a ID. [00:15:38](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m38s) I'm just using fire bug to do that. So that means you can just put that in front of the email. Not here though if you want to target it in your Java Script or in your CSS. Let me show you. You'd add #jform_email. [00:16:08](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m08s) Now you can target it with CSS. Maybe color or something. JavaScript is done in the same way. If you use jQuery, add jform_ in front of the field name. -The nice thing about this is that you can add the script to the field and in any view where you use this field this script will follow it. [00:16:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m54s) It will go along with it. It will be added to that view dynamically. You don't need to rewrite it everywhere. For example, I have a script that I'm using for numbers. [00:17:16](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m16s) Here is an even better option to demonstrate: I had to create a repeatable field, which we will look at later; it's an advanced field. Inside of that repeatable field I wanted to add a date field. [00:17:49](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m49s) Now those of you that work with Joomla will know that you can't currently add a date field to a repeatable field. So what we did (this is probably going to be very impressing) we simply used a text field and added that to it. [00:18:12](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m12s) As you can see here we have PHP right in this JavaScript block. The way to add PHP here is to do the open brackets, question mark, PHP, and then again question mark, close. There is an a PHP and we are adding the jQuery framework. Now this script I added to the repeated fields script area not to the actual text field. [00:18:45](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m45s) The reason why I didn't add it to the actual text field is because the text field is obviously going be repeated. So you are going to have ten, twenty, or whatever of that specific text field. +The nice thing about this is that you can add the script to the field and in any view where you use this field this script will follow it. [00:16:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m54s) It will go along with it. It will be added to that view dynamically. You don't need to rewrite it everywhere. For example, I have a script that I'm using for numbers. [00:17:16](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m16s) Here is an even better option to demonstrate: I had to create a repeatable field, which we will look at later; it's an advanced field. Inside of that repeatable field I wanted to add a date field. [00:17:49](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m49s) Now those of you that work with Joomla will know that you can't currently add a date field to a repeatable field. So what we did (this is probably going to be very impressing) we simply used a text field and added that to it. [00:18:12](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m12s) As you can see here we have PHP right in this JavaScript block. The way to add PHP here is to do the open brackets, question mark, PHP, and then again question mark, close. There is an a PHP and we are adding the jQuery framework. Now this script I added to the repeated fields script area not to the actual text field. [00:18:45](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m45s) The reason why I didn't add it to the actual text field is because the text field is going be repeated. So you are going to have ten, twenty, or whatever of that specific text field. But with this code I'm able to target up to fifty repeats of that field. [00:19:11](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m11s) With that field number we said at least fifty, and this JavaScript area is being repeated fifty times. So the course_date_fields_date is an ID I got from after creating the repeated field. I went in and looked at the ID of that field, added a datepicker, set the value of the datepicker, and basically added it to the field. [00:19:43](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m43s) It works very well. So this custom scripting area for JavaScript can also take PHP inside of it (and JavaScript) that will then be added to the view in which this field is going to be used. However, since we are just using it for creating a simple email field, we will click save; or save and close or save and new. [00:20:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m17s) + +So that was looking at creating a text field type. Now we'll do a list field. We click on list and we see that it has an option array or string there. The options are set with a zero, a (...), the name, and a coma. [00:20:45](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m45s) That basically represents one item in the drop down. So if you see this drop down here then each of those items would basically be represented between the comas. [00:21:05](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m05s) The (...) makes a separation between the value being stored in the database and the value being shown to the person accessing the form. If that value is the same value (if you want to store in the database the same value as the one that is being displayed) then you simply drop off the (...) with the initial values like that. It will now say option one, option two and option three. [00:21:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m29s) That is one permitted way to use it. [00:21:50](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m50s) You could also say that you want one option to be viewed as having not selected anything yet. So if you want to add another option you would type "select an option,." [00:22:15](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m15s) By adding a (...) without a value it is being treated as a null. So when the drop down is built, it will be as if nothing is selected. [00:22:57](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m57s) Now the other values would be selecting. You can use them as IDs or use a totally different value. It doesn't matter. Just know that it would possibly make everything lowercase if you put it on that side of the (...). [00:23:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m29s) You can fill in this information based on your requirements. So that's how you set up a list field. + +I hope this shows you what is possible, but as you can see this list field isn't dynamic in the way that a custom field possibly can be. [00:23:55](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m55s) You see the list field here where you statically set a few values that is unchanging and which should be selected. But with the custom field type you can have other tables values populate the list for you. So as it's being created your list gets longer dynamically. We will still look at that and it is obviously available, but this is more static "set it once and use it over and over" whereas there is actually also a dynamic list option which I will illustrate later. [00:24:39](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m39s) + +Let's look at a radio button which is very similar to creating a radio button. There is one point to make here however. If you create a radio button you'd see that there are only two values. You can add more than two to the list, but I always think of it this way: [00:25:04](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m04s) as soon as it becomes a list of values then use a list. A radio button should have four selections at most. (It depends on the length of the text.) As soon as it gets a fifth value, you should look at a list instead. Again, with a radio button you can just leave it at the default storing method. [00:25:41](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m41s) Again the field attributes are very similar to the text attributes except for the 'options array' option here. Then also like the list field type, it is separated by comma, and the store value and the display value are separated by a pipe. It is important to note that you cannot use quotation marks inside of your values. [00:26:06](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m06s) If you want to use quotations inside you need to look up the html equivalent of those quotation marks and use that. Then it would work, but if you add an quotation inside, it will break off the string and you would have only one value show up. [00:26:38](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m38s) + +Let's look at another one. Color is quite straight forward. It has a default value. You need to remember to set the label and the name. The type must not be changed. If you select color here and you do change the type, the component builder will simply ignore what you did. [00:27:16](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m16s) The reason for this is because we had set the type itself to be mandatory and unchanging when we had set up the field type. That's why you cannot override it. Everything that you set to mandatory and unchanging will fall back to the setting that you set there in the field type. Even if you change it here, it will not change. [00:27:44](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m44s) - -But with this code I'm able to Target Up to 50 repeats of that Field With [00:19:11](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m11s) that saying ok field number we said at least 50 And this JavaScript area is being repeated 50 times and incrementally And so the course date field Date again this ID I got from after creating repeated field I went in and looked at the ID That field Added a date picker Can I set the value of the datepicker And Basically added to the field [00:19:43](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m43s) And it works very well so this custom scripting area For JavaScript can also take PHP inside of it And JavaScript That will be then added to the view in which this field is gonna be used And it's I think it's very very nice feature that we have And it's very useful It's come in very useful for myself anyway Ok so we not gonna do that we just wanna use it for creating a simple email field So we will just click save or save and close [00:20:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m17s) and save and new So that's looking at creating a text field type now let's quickly do a list view a list field Sorry Not view So we click on list And we see that has An option aray or String here now the options are set with a zero [00:20:45](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m45s) and a pipe And then the name In a coma now that basically represents one item In the drop down So if you see this drop down here Then Then that is one item That is an item That is an item ok So each of those [00:21:05](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m05s) Would basically be represented between the comas The pipe Makes a separation between the value being stored in the database And a value being shown To the person accessing the form Now if that value is the same value So if it If you want to store in the database the same value as the one that Is being [00:21:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m29s) Displayed then you simply drop off the bipe with the Initial values like that So it will say option 1 2 and then that should be 3 right Option 3 Now That is another Allowed way to use it [00:21:50](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m50s) Or you could say I want one option to be viewed as having not selected anything yet so if you wanted to say Say option 1 Ok I wanna add another option You would say Please Select option Comma By [00:22:15](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m15s) By adding leave that please Because it's getting too long here Select an option By adding a pipe without a value Is being treated as a nul So when the form when the dropdown is built Then it will it will be like nothing is selected Basically that option see select an option It's exactly what I did here although this is a custom field this type field [00:22:57](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m57s) I don't have one of those here Sorry But just that you know That will basically Behave the same as that one OK And then the other values would be selecting And I have a you can use it as it is Or is even a total different value like that it doesn't matter just know that it possibly We would make everything lowercase which if you put it that side of the pipe [00:23:29](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m29s) Now This could be left Out And you can fill in these information based on your requirements So that's how you set up a list field I hope that Shows you what is Possible But as you can see this list field isn't dynamic In the way that a custom field possibly can be [00:23:55](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h23m55s) You see the list field here you staticly set a few values that is unchanging and which should be selected But with the custom field type which will look at in a later video you can I have another tables values populated the list for you So as it's been created your list gets longer Dynamically and will still look at that and that is obviously available but this is a More static said it once and use it over and over where is there is actually Were there is also a dynamic list option which I will illustrate later Well that is creating a list view Let's [00:24:39](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h24m39s) Quickly also look at a radio button Just very similar If you do Creating a radio button There is though one point to make here If you create a radio button You see that there are only two values And you can add more than 2 to the list but I always Think of it this way [00:25:04](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m04s) As soon as it becomes a list of values then use a list A radio button should at most have 3 selections or maybe at most 4 and really depends on the Length of the text So if it's yes no and maybe and No thank you oh my Yes No Maybe Not yet decided so that's four options Ok so that could be ok But as soon as it gets a 5th value possibly you should look at a list instead again with a radio button you can just leave it at You know the default storing method [00:25:41](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h25m41s) And again the field Attributes are Very similar to the text attributes except for this Options array option here Then also liked the list Field type it is separated by comma And the store value and the display value are separated by a pipe Now it is important to note that You cannot use [00:26:06](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m06s) These Exclamation marks inside Sorry not exclamation quotation marks inside of your values If you wanna use Quotations inside you need to look up the html equivalent Of that quotation marks and use that And then it all It will work but if you add a Quotation [00:26:38](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h26m38s) Inside here it will literally break off The String right there and you have only one value show up so that's just that you know Ok so that is a radio button let's look at another one quickly colour Colour is quite straight forward it has a default value you need to remember to set the label and the name Always the type It must not be changed And if you select colour here And you do change the type You realise that the component builder will simply ignore what you did here And also back to back [00:27:16](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m16s) It will not Because it is a field which When we set up the field type The type itself Was said to be mandatory and unchanging remember And That's why you you cannot override it Everything that you said to mandatory and unchanging Will fall back to the setting that you said there in the field type and it even if you change it here it will not Change [00:27:44](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h27m44s) Ok then there is the description And if it's required and show on again the show on feature is something that is very nice As we go we will get to see it in action But you can have a field like For example A list field which has an ID 2 which should be selected So did this colourfield should show So you could say Let's say that this Fields name is Access Or [00:28:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m17s) What would be in our ideal Let's say View And then One Would be If in the view field The option with the Value Of 1 is selected then will this field only show up [00:28:39](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m39s) No you can have it if 1 Or 4 is selected Then it will show up And this implementation is your Joomla Default implementation of the show on field Unfortunately It cannot target multiple other Fields yet as far as I know And that's why we have in component builder our own implementation which is far more advanced And which will look at once we get to views [00:29:07](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m07s) Ok so that's just looking at colour And and Let's see Another one that's quite interesting is category I suppose In category You have Extension And this extension if you read it Is the name of the extension for which the category will be retrieved for example To list content categories use the value com content [00:29:42](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m42s) You can add also target 1 View Use the value Com underscore component Dot view What that means is that you can just by adding the category field to a View You Automatically add a category to your component so it will you don't need to map the category at all in fact you cannot map with even if you wanted to [00:30:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m09s) Joomla Already has a category component in place And if you add a category well this category type field to which we are looking at now obviously you can Add your own category View And then use a custom field to link it's values to you to other views But if you are gonna use Joomla's category implementation that integrates with your component Then this is the way you do it and then you don't write anything for the category area Because Joomla do that itself and adds it to your component dynamically and the only thing You need to do is actually an extension [00:30:48](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m48s) Add your components name now we haven't looked at your component name And that In fact I think we possibly come back to category When we have Come to you know that area of Sermon distributor and where we add in categories to certain views But that you know The categories Can also be targeting just a specific view instead of the whole component itself So it can only be related even to just one specific View [00:31:25](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m25s) Which makes it nice that means you can have a category for listviews you can have a category for that you can have a category for this you can have multiple categories in one component This is maybe an overkill but it's none the less possible and the way you do that is Simply your component name and the specific views name And obviously the view must be in singular You you cannot target a list view it must be a editable Single View So it is only saying View Ok so that's looking at category will look at category again later stage where we actually will implement it Editor is also a very Common Field [00:32:11](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m11s) Which were often using And the editor is what is in your Joomla content article manager is that big block in which you articles are placed To here you can add such a block to your component And There are some Important things like the buttons and if you read the description we have here it explains to you how it works And including the Hide option And what kind of editor you want to load Obviously You're preferrable one and the alternative one [00:32:44](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m44s) Desired or alternative And the button option here is really like I said you can read it Hide buttons based on what you selected And then you have a filter option here and required Basically again your normal attributes as with with other field types In Joomla Since most of them are extending your base field in Joomla and then Type in name and label and defaulted These things are also available to all the others So that's quickly the editor [00:33:24](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m24s) let's see Media Just make sure with media that you Select the correct directory If none is set I think it falls back to images but you can target with a specific directory inside of images And I can see there it's mandatory so you need to set it And you can only Target Images itself which is a limitation from Joomla side So that that directory starts at images right so says the attribute should be relative to the top level [00:34:01](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m01s) Images folder So that means let's see you you want to Target a specific folder inside images called foo Then you would add that they're like that And then preview if an image is been selected do you want Image to be able to be previewed By hovering over the side of the field and you just change it to true if you want to Again the show on feature is here in the other default concepts that we've already discussed Another one that's nice Is notes Notes is basically above a field or like here if we said this is a note [00:34:43](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m43s) that you see here And so you can add notes Around your fields And it has very nice Implementation right over there But you can read through And Yeah I think that will be all for us looking at field types Well basically looking at the basic field types or Common Field types [00:35:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m09s) If there is any other feel types with you felt You need help with Please look up the Joomla documentation since the implementation is more or less a straight forward Trying to not Redesign the wheel We simply trying to implement Joomla's way of doing it And if there is a field type you need more information on you can simply Go look at Joomla's documentation on that field type and if they don't have documentation then Can you can go into [00:35:41](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m41s) The field Like I said libraries there are 3 places to look CMS Joomla and Legacy in the libraries folder Is the places where these Fields of found So if you look under the CMS folder you got captcha field type chromestyle content editor so there's the editor So you wanna know if there is more attributes that [00:36:06](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m06s) Can be used in editor You can open the editor and look through the code And see the The attributes that are Being implemented across the board here it set height with $ value author value author field set So It Goes On And if you see that there is a attribute that we are not already targeting You can like I have to explain Go to the field type open it Add the attribute [00:36:37](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m37s) Add the name add the value set with it is mandatory obviously I think if we left it out it's not And whether it's translatable translatable is an important concept Which not all fields are translatable and And when a field is translatable Sermon sorry component builder basically translate it for you So If you look at The It's use this acronym for example You see I added there the label as acronym Then while component builder builds this field into your component it takes that value [00:37:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m17s) And it Converts it into a translatable string which adds it to the language file And it adds that In here so that if somebody updates the language file that updates everywhere in the system Which is basically means that Languages are implemented everywhere in component Builders components All the components it's building it translates label for everything that you said to be translatable So if we If we look at Let's go look at a certain Field type like text [00:37:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m54s) Any property That you said is translatable like here the label is yes And description is yes And that seems to be it Hint is also translatable it's also said to yes Means that Component Builder Will dynamically take hint And translated into a language string added to your language file And replace the XML with the language string like it's done here [00:38:31](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m31s) So That is How you can extend existing field types And create Fields with them I hope that is Good enough for you to get your hands into or to get excited about it in to use it Obviously having Fields might still feel very Primitive And so next up will be looking at [00:38:59](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m59s) Adding those Fields to views And basically making building your view Itself +Then there is the description. If it's required and show on (the show on feature is something that is very nice As we go we will get to see it in action) But you can have a field like For example A list field which has an ID 2 which should , comma bybe selected So did this colourfield should show So you could say that this field's name is access or [00:28:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m17s) What would be in our ideal Let's say View And then One Would be If in the view field The option with the Value Of 1 is selected then will this field only show up [00:28:39](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h28m39s) No you can have it if 1 Or 4 is selected Then it will show up And this implementation is your Joomla Default implementation of the show on field Unfortunately It cannot target multiple other Fields yet as far as I know And that's why we have in component builder our own implementation which is far more advanced And which will look at once we get to views [00:29:07](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m07s) Ok so that's just looking at colour And and Let's see Another one that's quite interesting is category I suppose In category You have Extension And this extension if you read it Is the name of the extension for which the category will be retrieved for example To list content categories use the value com content [00:29:42](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h29m42s) You can add also target 1 View Use the value Com underscore component Dot view What that means is that you can just by adding the category field to a View You Automatically add a category to your component so it will you don't need to map the category at all in fact you cannot map with even if you wanted to [00:30:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m09s) Joomla Already has a category component in place And if you add a category well this category type field to which we are looking at now obviously you can Add your own category View And then use a custom field to link it's values to you to other views But if you are gonna use Joomla's category implementation that integrates with your component Then this is the way you do it and then you don't write anything for the category area Because Joomla do that itself and adds it to your component dynamically and the only thing You need to do is actually an extension [00:30:48](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h30m48s) Add your components name now we haven't looked at your component name And that In fact I think we possibly come back to category When we have Come to you know that area of Sermon distributor and where we add in categories to certain views But that you know The categories Can also be targeting just a specific view instead of the whole component itself So it can only be related even to just one specific View [00:31:25](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h31m25s) Which makes it nice that means you can have a category for listviews you can have a category for that you can have a category for this you can have multiple categories in one component This is maybe an overkill but it's none the less possible and the way you do that is Simply your component name and the specific views name And obviously the view must be in singular You you cannot target a list view it must be a editable Single View So it is only saying View Ok so that's looking at category will look at category again later stage where we actually will implement it Editor is also a very Common Field [00:32:11](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m11s) Which were often using And the editor is what is in your Joomla content article manager is that big block in which you articles are placed To here you can add such a block to your component And There are some Important things like the buttons and if you read the description we have here it explains to you how it works And including the Hide option And what kind of editor you want to load Obviously You're preferrable one and the alternative one [00:32:44](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h32m44s) Desired or alternative And the button option here is really like I said you can read it Hide buttons based on what you selected And then you have a filter option here and required Basically again your normal attributes as with with other field types In Joomla Since most of them are extending your base field in Joomla and then Type in name and label and defaulted These things are also available to all the others So that's quickly the editor [00:33:24](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h33m24s) let's see Media Just make sure with media that you Select the correct directory If none is set I think it falls back to images but you can target with a specific directory inside of images And I can see there it's mandatory so you need to set it And you can only Target Images itself which is a limitation from Joomla side So that that directory starts at images right so says the attribute should be relative to the top level [00:34:01](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m01s) Images folder So that means let's see you you want to Target a specific folder inside images called foo Then you would add that they're like that And then preview if an image is been selected do you want Image to be able to be previewed By hovering over the side of the field and you just change it to true if you want to Again the show on feature is here in the other default concepts that we've already discussed Another one that's nice Is notes Notes is basically above a field or like here if we said this is a note [00:34:43](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h34m43s) that you see here And so you can add notes Around your fields And it has very nice Implementation right over there But you can read through And Yeah I think that will be all for us looking at field types Well basically looking at the basic field types or Common Field types [00:35:09](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m09s) If there is any other feel types with you felt You need help with Please look up the Joomla documentation since the implementation is more or less a straight forward Trying to not Redesign the wheel We simply trying to implement Joomla's way of doing it And if there is a field type you need more information on you can simply Go look at Joomla's documentation on that field type and if they don't have documentation then Can you can go into [00:35:41](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h35m41s) The field Like I said libraries there are 3 places to look CMS Joomla and Legacy in the libraries folder Is the places where these Fields of found So if you look under the CMS folder you got captcha field type chromestyle content editor so there's the editor So you wanna know if there is more attributes that [00:36:06](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m06s) Can be used in editor You can open the editor and look through the code And see the The attributes that are Being implemented across the board here it set height with $ value author value author field set So It Goes On And if you see that there is a attribute that we are not already targeting You can like I have to explain Go to the field type open it Add the attribute [00:36:37](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h36m37s) Add the name add the value set with it is mandatory obviously I think if we left it out it's not And whether it's translatable translatable is an important concept Which not all fields are translatable and And when a field is translatable Sermon sorry component builder basically translate it for you So If you look at The It's use this acronym for example You see I added there the label as acronym Then while component builder builds this field into your component it takes that value [00:37:17](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m17s) And it Converts it into a translatable string which adds it to the language file And it adds that In here so that if somebody updates the language file that updates everywhere in the system Which is basically means that Languages are implemented everywhere in component Builders components All the components it's building it translates label for everything that you said to be translatable So if we If we look at Let's go look at a certain Field type like text [00:37:54](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h37m54s) Any property That you said is translatable like here the label is yes And description is yes And that seems to be it Hint is also translatable it's also said to yes Means that Component Builder Will dynamically take hint And translated into a language string added to your language file And replace the XML with the language string like it's done here [00:38:31](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m31s) So That is How you can extend existing field types And create Fields with them I hope that is Good enough for you to get your hands into or to get excited about it in to use it Obviously having Fields might still feel very Primitive And so next up will be looking at [00:38:59](https://www.youtube.com/watch?v=9NO2rKnC6Ug&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h38m59s) Adding those Fields to views And basically making building your view Itself