joomla/Component-Builder
joomla/Component-Builder
39
23
Fork 11
Code Issues 80 Pull Requests Projects 4 Wiki Activity
Page: 066 The new fields Area to make things easier
Pages
001 Hello World with Joomla Component Builder 002 Intro to JCB 003 Installation of JCB 004 General Planning 005 Field Types 006 Basic Fields 007 Admin Views 008 Advanced Fields 009 Adding Admin Views to a Component 010 Component Settings 011 Component Scripts 012 Component FTP and more 013 dynamicGet 014 Adding dynamicGet to a Site View 015 Adding Templates and Layouts to a Site View 016 Template Setup 017 Layout Setup 018 Custom Admin Views 019 Adding Site Views to a Component 020 Adding Custom Admin Views to a Component 021 Tweaking MySQL Demo Data 022 Global Settings of Component Builder 023 Adding a custom time field 024 How to integrate the Create User Helper Method in your Components 025 How to use email helper in your components 026 How to setup a store message method along side the email helper class 027 How to ensure that a field is not escaped when added to list views 028 How to change exported values and setup custom import options 029 How to overwrite the custom fields 030 How to filter a list field based on association with another field 031 Automatic import of custom code during compilation in JCB 032 JCB manual custom code implementation 033 Export Import of fully mapped components 034 How to add Custom Buttons in JCB to your component Admin Area 035 Translation Mananger in JCB explained 036 Setting Site View Permission 037 Auto create SQL updates for Componets in JCB 038 Setup Site Edit View in JCB 039 Automated backup system in JCB 040 Adding Helper Structures to any JCB component 041 Upgrade to JCB v2.5.8 and using the new Admin View and Admin Fields 042 How to setup tabs after upgrade to v2.5.8 in JCB 043 Major Release of JCB v2.6.0 044 Hello World Component with Joomla Component Builder Creator Extended 045 Adding your own rule validation to a field in JCB 046 General overview of how community snippets work 047 Tutorial on forking JCB snippets so you can share your snippets with the rest of the Community 048 Tutorial on making a pull request at Joomla Component Builder Snippets 049 The New Library Manager Area 050 Easy Translation via excel 051 Dynamic Router Implementation Explained 052 Automated database updates in Joomla during development of a component 053 Quick Subform Demonstration 054 VDM Package Import Option 055 Dynamic File and Folder Inclusion concept 056 How to use the file field type to upload a file in JCB 057 Drag and Drop Upload functionality in JCB 058 The Quick Hello Word with JCB 059 Adding none database fields to an admin view 060 The custom dashboard option in JCB 061 Add or Remove Prefix to Component Name in Joomla Menu 062 Add your own JCB packages to the JCB Communty Directory 063 Proposed Collaborative Workflow in JCB 064 How to install jcb packages 065 JAB18 Using Joomla Component Builder 066 The new fields Area to make things easier 067 Adding Language String to your Component and get the Language Placeholder for dynamic use 068 Library Manager Anticipated Functionality 069 Join Fields in the admin list view with field relations 070 How to change the License Template in JCB 071 Reuse Custom Code 072 Setup Local Development Environment with Bitnami 073 JCB Fields Type Extended 074 How to add Joomla Custom Fields 075 Expand Custom Field Type Beyond The Default 076 A Quick Demonstration to Load a List of Items in a Site View 077 Run Expansion Explained 078 How to Add a Form to a Site View 079 Update the Site Form Field via URL Parameter 080 How to Add More Helper Methods to Your Components Helper Class 081 Easy Validation Rules for Fields in JCB 082 New Placeholders Feature 083 Manage a Components Global Config Option Field in Relation With Menu Params 084 Default Database Values can be set per Field Type Beta Testing Component Settings Develop a Joomla Component Guide to use the Component Builder Developing with Joomla Component Builder Home PHP Settings TIPS: Custom Code Using the JCB Demo Component While Building Your Local Development System
14 066 The new fields Area to make things easier
Amigo edited this page 2019-10-14 07:35:21 +02:00
Table of Contents

THE NEW FIELDS AREA TO MAKE THINGS EASIER

Explaining Changes In The Field Area

00:00:08 (Click on these time links to see Youtube video)

I would like to explain a little bit more about all the changes that had been made to the field area. The field area is really the foundation a great part of your component. It is what causes many of the behavior and concepts which is in your views. The field area had been a difficult area to change and it is still in progress. The interface most probably will not change much, 00:00:38 just little tweaks here and there. The back-end of how we deal with the data will certainly be improved.

A Quick Recap How It Used To Look

00:00:46

Just a quick recap of how it used to look. If we go to an older install of JCB and open a field. If the Alias is opened, we would see that it has this XML field definition area. In the past it was very easy to leave out, maybe leaving out anything by accident, change something and then it breaks. We had a lot of freedom and as developers, I am sure this did not feel in any way to be a problem. Whatever you have selected we build the XML for you and you could just adapt it as you please. 00:01:33 Since we are trying to make JCB more stable and eventually much more user-friendly. This new feature was suggested by the team. Therefore the decision was made to add it.

Removed The XML Definition Area Replaced It with Sub-form

00:01:55

What had been done? We removed this XML definition and we have replaced it with a sub-form. We've moved the database values to its own tabs. We also moved the field information to its own tab. We added a lot of structures and tools to the page. Let's show you that. Version 2.7.5 00:02:28 which is the stable release of this change. If we open that same Alias which we did just now, you will see it looks like this now(see video). You have a sub-form, with those values in a sub-form layout. You have a lot of new information. It also has the Database in its own tab. The Type Info is still available and you can still come and 00:02:58 review. The new option still gives you the ability to add those fields which are not already on the page. You could still say I want to add 'size'. We still load the description of the field on the page in the default value, which you can then change. Except when it tells you that it must be text. We have not yet 00:03:31 blocked this field from being changed or being removed, though it is mandatory. If you do leave it out on compiling, the component we will detect that it is mandatory. If you did not add value, it will fall back to its default value. 00:03:59 That is how it currently behaves. I wouldn't develop it in that way, best practice is to put in the value and make sure that is correct. That is the new Field area. There have been some hiccups and 00:04:23 bugs which we have ironed out the predominantly all those we know about. We also added this new option, we have not fully released some of the features but there is this option which is going to separate if you use the custom Field currently. It adds the PHP in the rows which 00:04:50 is a little tedious if you want to change this to keep track of the open braces.

New Implemetation For Custom Fields and Custom User

00:05:00

Just a little peek of what has been done. It will be in version 2.7.6. If you have watched this video after those releases you possibly already have it. Click on New, this is New implementation for the Custom Fields and also for Custom user. You click on it, it will take the PHP and adds it to its own little text area. Now you can easily follow and adapt the 'getOptions' method PHP values. That is 00:05:40 quite more convenient I suppose than using one line at a time. If we look at the user, you have two fields then, one for the 'getExclude' method and one for the 'getGroup' method. They are also immediately available to you.

Advantage - Extra Properties Options - Listclass Option

00:06:05

The other advantage of this implementation is, we have this new Extra properties option which has been available in JCB for some time. Many of you may not know that it exists. There is what we call 'listclass'. If you want to add a class like a CSS class value to the field when it appears in the list area. 00:06:29 Let me show you this area(see video), this is the list area. Well, any of the views where you see a list of items and you want this specific value to have a specific CSS class value because maybe you want to style it somewhat differently. Then you have this option to use. All you need to do is 00:06:53 click 'listclass' and you add there 'my-class-dean'. Whatever you want to call it. It will add that the class to the 00:07:15 field in the list area which is quite stunning.

Escape Option

00:07:19

There is also the 'Escape' Option. If you escape a value, all the values are escaped by default. If you want a value not to be escaped because you are going to have values in it, which if it's escaped, it gets stripped like a span tag and stuff like that. You could say: 'false' and then the specific fields. Now when I say escaped, I mean in the list area, again this area. When there is a list value. Then this is a being escaped at the moment. If you do not want that done, then you can add this false escaped.

Display Option

00:08:06

The other option is also available. It is the 'Display option'. We will still add some more documentation to this, but it is about when the field gets displayed in config, it is when a component has this options area. You can add Fields to that option area. When a field is added to the option area, it has implementation structures. You can let it show in the menu, you can let it show in various places. 00:08:43 I will make a tutorial about this specifically. But just to show you quickly that that is also are available.

Validate Option

00:08:53

Last but not least, there is 'Validate'. Not all fields have the property to validate the value. There are Validation Rules. You can add a validation to this field if that property is not available in the field type, which you have selected. If it is, we would suggest that you add it to the properties at the top. It says that, if you have a validation set as a field property, this extra property will not be needed because you can just use that one. 00:09:33

That was a quick demonstration of the new field area. We trust that it will be as easy and as comfortable as we hoped it would be. Trust that this change would not frustrate you, but be great. Because of one of the unforeseen 00:10:00 outcomes, for example, maybe, if you have a field like this which already has all its values and you are thinking of changing it and say, let me just check how will the text look. You can change it and it really adds all your text value with its defaults. If you say no, I want to go back, you can click back, and your values which were there originally has 00:10:25 again been added to the page. That is even true if you were to remove a specific property and you want to add it back, it adds the original value back because by accident 00:10:48 you might remove it and want to just put it back. It should be as easy as that. You could still go to 'Type Info' to see what could be the default values and adapt them. It is not like you do not have access to the default values, it is just that we want to 00:11:10 recover your current saved value for you. Whenever you add another field that is not already here, this drop-down list only shows the fields that are not already on the page. You will not end up adding field properties the second time. It has become much easier to build fields and their properties as before. 00:11:39 You really had to navigate through some of the complexities of dealing with an XML set of values of which maybe some of you do not know what is going on. Those of you that do, I mean it is not like you are losing any advantage with the new implementation, 00:12:02 you are still targeting that value with any value you want. It is still as easy as clicking a plus and selecting a value and adding it. I do hope that all of you will be as excited about this change as we are. We are now at the point where making JCB easy-to-use is also a priority.