Form Templates (custom classes for inputs)
Hi,
I am a PHP developer. I am trying to change the appearance of the "Log in" form and would like to add special classes to the inputs. I added the "Login" block to the "Homepage" page and would like to make it appear differently here than on other pages. How can I override the class or apply a different template to this one? I Found `BxBaseServiceLogin.php`, and I know how to override that in my module but it looks like that is not handling the actual HTML code for the form.
Ben
-
Hello bpmct !
The best way to detect what method from what file is used for the drawing of the block is the next (Developer app should be installed):
1) Go to Studio->Developer->Pages->System->Log in(2) area.
2) Click on "Log in with Sign up link" title.
3) I the appeared popup, look on the "Content" field content:
array (
'module' => 'system',
'method' => 'login_form',
'class' => 'TemplServiceLogin',
)
It means that this block is drawn by the method serviceLoginForm from the template class TemplServiceLogin.
4) If you use Protean template for example then go to folder modules\boonex\protean\data\template\system\scripts\
5) Find there the file BxTemplServiceLogin.php and open it.
6) It has the following code:
class BxTemplServiceLogin extends BxBaseServiceLogin
{
public function __construct()
{
parent::__construct();
}
}
It means you need to check also the base template file template\scripts\BxBaseServiceLogin.php, the method serviceLoginForm has been declared there. But you may to redeclare it in BxTemplServiceLogin. But notice that the changes in any standard module files may block the automatic updates. So it's better to write your own modules https://github.com/unaio/una-vendor-test/wiki
-
Thanks for the help! I am doing it in my own module so it won't block any updates :)
One more question - Inside serviceLoginForm, it looks like most of the code I want to modify comes from:
$sFormCode = $oForm->getCode();
($oForm is this: $oForm = BxDolForm::getObjectInstance('sys_login', 'sys_login');)
Which seems to be the default way code is generated for any form. If I want to generate the elements differently for the login form, how can I do that?
-
You can do it via Studio->Forms app in the first zoom. No need to change smth in the form classes. Also, look at this manual forms here https://github.com/unaio/una/wiki/Dev-Forms
-
Hi Leonid,
Makes sense. I see that you can edit the input names (and even the input attributes in the SQL database), but I want to give elements in the login form different CSS classes from how normal forms are generated. For example:
normal form input: <input type="text" name="ID" class="bx-def-font-inputs bx-form-input-text" autocomplete="off">
input in the login form: <input type="text" name="ID" class="special-login-class bx-def-font-inputs bx-form-input-text" autocomplete="off">
I cannot do that in the Studio Forms editor or even SQL... I know I can change the "attrs" for each input but the classes are handled somewhere else. I was hoping there was a way I could handle form HTML code generation per-form or make a different template that generates different HTML elements. I was close, but then I saw that all of the login form code comes from:
$sFormCode = $oForm->getCode();
which is how ANY form gets the code. What am I missing?
-
Nevermind, I got it. You can add custom classes to individual inputs with the attrs column in the attrs column of the sys_form_inputs table with a serialized associative array.
For example:
UPDATE `sys_form_inputs` SET `attrs` = 'a:1:{s:5:\"class\";s:10:\"ben_did_it\";}' WHERE `sys_form_inputs`.`id` = 3
Then, just add the SQL code to install.sql and uninstall.sql for your module. Thanks for your help @LeonidS.
.