Hide/Show "New User" field on login screen with HTML template

Hide/Show "New User" field on login screen with HTML template

In this article, we will learn how to enable the "Hide/Show" feature that is available within the "Security -> Settings" option, for the "New User" field found in the login screen that was generated with HTML template.

Currently, this feature is automatically enabled when the security module is generated without using a custom HTML template for the Login screen. However, so that we can enable it in our login screen that has an HTML template, we must add two JavaScript functions inside our template's index file.

Below, let's see the procedures performed in each topic:

Enabling the field inside the HTML template index file

If the field is not enabled in your template, we need to follow the step by step below:

1 - Within the Login application in your ScriptCase, more precisely in "UserHTML", we click on the Check button to verify the fields that are not included in the HTML template file located in the external libraries. The expected result should be as shown in the images below:



2 - When clicking on "SC_FIELD_INFO_new_user", a modal window will open that will show us an example of where the field should be added inside the HTML template:


3 - Go to the "Tools -> External Libraries" option, then "Edit" in the library that we are using for the login HTML template, and look for the ".html" file:






4 - We add the field inside the "form" tag in the HTML code, and save the file:



5 - We go back to the Login application, and click again on the Check button (according to the first step), and we get the "OK" check for the {new_user} field:



Enabling "scHideUserField()" and "scShowUserField()" functions to enable "Hide/Show"

For this option to work in the Security Module settings, we will need to add these two functions within the HTML code of our template.

The script for both is available below so we can just copy, paste and save:
  1. <script type="text/javascript>">
  2. // Function to enable and disable the new user field
  3. function scHideUserField(fieldName)
  4. {
  5.   if(fieldName == 'new_user')
  6.   {
  7.     $('#id-new_user-1').hide();
  8.   }
  9. }
  10. function scShowUserField(fieldName)
  11. {
  12.      if(fieldName == 'new_user')
  13.     {
  14.     $('#id-new_user-1').show();
  15.     }
  16. }
  17. </script>
It is important to point out that this script must be added inside the "head" tag of the template's HTML file.

Another point before finishing is related to the "id" of the field that is passed as a parameter inside the conditionals in the functions.

This "id" must conform to what is referenced in the template's HTML code, and so that we can capture this information, we can inspect the element with the Login application running, and identify which "id" represents the field "new_user" to replace what is found in the above script.

As you can see in the image below, on the right is the HTML code of the template, but highlighted is the "New User".

The information that interests us is inside the "div" tag that is above the highlighted code, which is precisely the "id-new_user-1". Just replace the script's "id" with the "id" that appears in your HTML template.


In the example script above, this id is already included in the conditional, because it is the example template from ScriptCase's sample library.

Once that's done, just save and run the application again, and access the account to enter the "Security -> Settings" option, and enable or disable the new user field to be shown or not on the Login screen.





    • Related Articles

    • Hide/Show "Retrieve Password" field on login screen with HTML template

      In this article, we will learn how to enable the "Hide/Show" feature that is available within the "Security -> Settings" option, for the "Retrieve Password" field that is found on the login screen that was generated with HTML template. Currently, ...

    • Hide/Show "Remember Me" Field on Login Screen with HTML Template

      In this article, we will learn how to enable the "Hide/Show" feature that is available within the "Security -> Settings" option, for the "Remember Login" field that is found on the login screen that was generated with the HTML template. Currently, ...

    • Calendar By User

      In this example we'll show a connection between an application of Control and the Calendar. This feature can be used for a particular user to view your timetable where their activities are scheduled. Step 1: We will create a calendar, link: (See here ...

    • Request a new license

      Some situations require the reinstallation of Scriptcase, in these cases, the user must generate a new serial on our website to register the tool. Follow the steps below to generate a new serial:  1. Log in to the website The entire process to ...

    • Creating new themes for Scriptcase

      In this article, we will show how to create and edit new themes for your applications. Scriptcase afford a complete tool for creating themes, can change the layout of buttons, all the CSS application, and the application's menu bar menu. With a ...