joomla/Component-Builder
joomla/Component-Builder
39
23
Fork 11
Code Issues 80 Pull Requests Projects 4 Wiki Activity
Page: 038 Setup Site Edit View in JCB
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
17 038 Setup Site Edit View in JCB
Amigo edited this page 2019-10-07 15:26:49 +02:00
Table of Contents

SETUP SITE EDIT VIEW IN JCB

Adding Admin View To Front-End Site

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

How to add an Admin View to the front end of your site. There can be editing and submission of the front end of this specific Admin View. The public version of JCB which contains this Demo Version is being used to illustrate this. First, it is compiled and installed to the local Joomla website. Install it, open it. Here is the Demo Version that is publicly available and it has an Admin View called "Looks". 00:01:07 If you go to the ListView of the Admin View, called 'Looks', there is none. Create 'New'. There is a description box in the New view and 'More' item, where you can click, and see some custom fields: 'email', 'mobile phone', 'date of birth', 'image', 'website' and the normal Publish, Permission, Structure for the view, and the name field. Now that is what has been referred to as the Admin view. It is this combination of fields working together in one view.

How To Add Editing Area

00:01:50

To add an editing area, (these three tabs) to the front end of the site that it will function as a form will be explained. To determine who can be allowed to access the form will depend upon the permissions structure. The permission structure controls who can edit and who can add items to a specific Admin view. 00:02:14 Currently the public cannot edit this, if an item is created they cannot edit it. There is an item level on permissions. If it is closed then it can be seen that there is also a 'Global' control on permissions in 'Options'. The Global control of permissions is also if you want the public to be able to submit to this form, it is necessary to allow them to be able to create. 00:02:46 Set it to 'Allow', and the public is allowed to create. Most components have more than one view. This one has only one; it is called 'Look'. Over here('Look create') say allow, and if you want them to edit existing submissions. 00:03:13There is the 'Edit state', 'Edit own', 'Created by', all these things in the global spec, as well as in the local edit of the view.

Two Switches

00:03:30

There are two switches. One is a global switch and one that is specifically focusing on the view. If the view cannot be accessed on the front end after it has been created, it is necessary to come back to this area and sort out the permissions for the specific group who should have access to the specific view on a front end. 00:03:57 This permission structure is quite intense and extendable. Specific groups can be targeted with specific permissions for every view that JCB builds in the Admin as well as in the Site views. Cancel out, no further changes will be done and it returns to the Demo Component.

Demo Component - Settings

00:04:21

In JCB there is a switch that can be flipped for JCB to write the code for the site end of this component. So go back to JCB and to components and open the component. In the component, there is an area called 'Settings' where all the admin views are linked. If that is opened, it may be seen that there is usually this bug in Joomla, which if it is opened for the first time does not reflect the original setting. I usually open it, cancel it, and then open it again and the original setting is back. 00:05:17 You will see that 'Edit/Create Site View' must be set to 'Yes'. If it is set to 'Yes', then it means that it is going to create a Site View of this 'Look' so that it can be edited on the site end and not only in the Admin area and it also means Create items. Save this and then also save and close. Go back to compiler, compile demo. Install it.

Code - Controller - Model - View

00:06:05

Looking at the demo websites folder structure in the code, there is a com_demo folder under components. 00:06:19 There are the Models as well as the Controllers and the Views. This is the View that was dynamically generated by JCB. The View, the Model, and the Controller are called 'Look'. Open (controller look.php) to see what was the code that was written. 00:06:49 It looks very similar to the Admin Area except that it has been slightly modified for the front end and its requirements. As you can see we were adding some CSS classes and JavaScript from the back end. Here is the 'model','getItem', 'getForm', and the Controller.00:07:16 It shows the code that has been created. The fact that this was created, does not mean that there is a set of links that you can click and edit the forms which was submitted or that there is a link to create any. These things should be done manually.

Manually Add Links

00:07:51

Under site views there are two views, one is called 'Looks' and another one is called 'Looking'. As you can remember the one we looked at here, which I set was automatically generated is called 'Look', so that one is not showing because it was a tick box that created this whole View model and Controller. It is not necessary to build the 'Look' view again but you need to get links to it. 00:08:21 In 'Looks' a Dynamic Gets is used, as well as in 'Looking'. Open the Dynamic Get page. There is one called 'Looks' and 'Looking'. Go to the Looks Dynamic Get. It got a custom script area were it is asked whether the items are set or whether there are items. 00:09:10 Then loop through them('$cando')(See video), it may be seen in the Helper Class there is a 'getAction' function.

The 'getAction' function inquires whether the current user has the edit option to the specific 'look' item. If it does, it builds in this little script an edit 'look' button and dynamically adds that to the edit link, which is coupled to the item, and then continues on. It dynamically generates the button for 'edit' in the dynamic get. 00:09:48 It could have been done anywhere. I decided to do it here because then it gets added to the model, which is more where your logic, for lots of the data structure, should be placed. Go back to the Site Views, open the 'Looks' Site View. It may be seen that the 'Main Get' is set as 'Looks'. If you scroll down, in this area(See video) we are looping through the 'Look' items, and echoing the edit link after the description.00:10:25 That means the link that has been built in the Dynamic Get which is the button, it will either be empty and therefore show nothing. If the user does not have the permission to edit it, or it will show a button. 00:11:04 A link has not been added for creating 'New Looks' and the same would be required to do that.

  • Add A Button To Create New Looks

00:11:19

The same button script may be used, copy that. Here before the table, a button could be added to create 'New Looks'. All that would need to change is this link here ((index_php?option_com_"Component") that it will have an ID to zero. It will create a 'New Look'.

That is how to add an editable Admin view to the site end of your component. 00:11:53 Then link it into your Site view, that you can click on a button and edit a specific ID view or create more. Then control that with this 'getAction helper class method', which indicates whether it can be edited. Look at this Helper class in the code. 00:12:23

For example: In the code, in 'Helpers', open 'demo.php' then scroll down to the method called 'getAction'. 00:12:50 You can go through this logic to see that here are dealt with a number of concepts and we are trying to determine the permission to edit 'own' and to 'create'. It all gets stored and gives it back in the result set. 00:13:17 You could also 'echo' out the result, 'var dump' or something in the 'Look' to see exactly what is the result from that structure.

If we go back to the 'Looks' view and open that model. 00:13:42 It will be seen that the custom scripting that creates the button, gets added from JCB(see video). You could add a 'var_dump'; exit; and take '$cando' 00:14:06 and login as any kind of user on the site, then when the page is loaded, it should display the '$cando' list of that specific user group. Also, keep in mind that here is the 'Authorise' setting that is applicable to the Looks Site View and is also controlled in the permission structure. 00:14:33 Always keep in mind that there are a lot of permissions automatically being added to components build in JCB. If it appears that things do not function properly, it may be that it had not been kept in mind that there is a permissions structure, and it is necessary to adapt that permissions structure as it is fitting to your project.