Improving frontend forms in Joomla
With the upcoming stable releases of our Joomlatools extensions we are working hard to get the remaining issues out of the way. One of the problems many of our customers reported during the release candidate phase are extension and template conflicts on our frontend forms. To re-solve those conflicts and to further improve the usability we have completely redesigned our forms for both frontend and backend.
Whats the problem?
More than often we get reports from customers that either some form button isn’t working or that our frontend forms don’t look like they expected. For example recently a customer reported: “I cannot add documents in DOCman on the frontend, the ‘save’ button in the form is not working.”
This is because in Joomla, frontend forms are loaded inside the template. The template is in control and the form/component needs to adjust itself. Since we don’t have any control on how a template works this can result in all sorts of strange effects: forms that are not working, buttons that are positioned wrongly, colors that don’t match, etc…
How are we solving this?
Most conflicts can easily be solved by making smaller code changes to the template, or by turning off a conflicting extension. Finding the conflict is not an easy task though. We need to investigate each site separately, find the conflicting extension and turn it off, or create a custom fix and apply it. There should be a better way.
The solution: “a custom component frontend template.” (*) Instead of rendering the form inside the active frontend template, our extensions now have their own custom frontend template in which forms are being rendered.
This template is only used on specific pages and only loads the files we need. So no files, neither CSS or JS of other developers/extensions are loaded. As a result, no more conflicts and as an added benefit our forms also load super fast.
() Note : This template is embedded inside the component, it’s not installed as a normal Joomla template.*
What does this mean?
We are now able to use the exact same form layout on the frontend as in the administrator. Adding and editing documents in DOCman on the frontend will feel very familiar when you come from the administrator.
As an extra treat, by using this new technique we have also been able to make the forms fully responsive! You can now edit DOCman documents on your mobile device in a nicely responsive layout without problems.
The best thing of course is that we no longer have any conflicts with other templates/extensions. Our frontend forms will always work and render in the exact same way everywhere. No matter what template or extensions you are using.
When can I expect this ?
You can expect these changes in the final release of DOCman 2 which is in testing phase at the moment.