Hi there,
I think what you are asking here is that how do make the 'title' attribute of the editor of a Field Control to be whatever you have set that control's help text to be. This will then mean that this is popped up when the editor is hovered over with the mouse.
There isn't a direct way to perform this in Ebase Xi. Although Custom Attributes offer a way of overriding 'normal' html attributes such as the title attribute, this is more of a side-effect of their intended purpose which is to provide a way to make use of libraries which dictate the use of specific attributes in order to perform some action on them (for example the jQuery mobile and jQueryUI framework libraries).
Really what there should be is a way to specify a title as a property of the Field Control (as well as any others that might be appropriate) and allowing that to be set dymanically in the same way as the majority of properties of a control are. I think that this is something we will look into doing as an enhancement in the future.
This doesn't really help you now, however.
There is a way of doing this using jQuery however, which may, or may not be appropriate depending on the form you are designing.
Here is a general approach to acheiving this (if you only want 1 Field Control to behave like this there are more precise methods to use, but this will still work).
This assumes that you are aware of Client Scripts in Ebase Xi, if not have a look at:
http://dev-docs.verj.io/ufs/doc/Creatin ... lients.htm
http://dev-docs.verj.io/ufs/doc/Creatin ... y_Step.htm (there is a useful section about setting up jQuery as a client script here, which you will need to do if you haven't already).
1. Add the help text to any Field Controls you want this to affect as normal and set the 'Help text position' property of them to: 'To right of editor'.
2. In the HTML Properties of the Field Control(s) in question add 'changeTitleToHelp' to the Class Locator and press OK. Only those Field controls with this Class Locator will be affected.
3. Go to the Ebase Xi Designer Tree go to the Web Resources Folder, right-click and select add new->Client Script.
3.1. Name this script (does matter what), copy the following into it and press OK.
Code: Select all
function setFieldTitlesToHelpText($, showhelpText)
{
var fieldsToTitle = $('.changeTitleToHelp');
for(var i = 0; i < fieldsToTitle.length; i++)
{
// the help of the field control must be set to display in the designer
// or things will go very wrong
var help = $(fieldsToTitle[i]).find('div').last();
if(!showhelpText)
{
$(help).css('display', 'none');
}
$(fieldsToTitle[i]).find('input,textarea,select').attr('title', $(help).text());
}
}
4. Go to Form Properties, click on the Web Resources Tab and click on the ... button by the Client Scripts section.
4.1 Add the jQuery library as an External Client Script (see
http://dev-docs.verj.io/ufs/doc/Creatin ... y_Step.htm)
4.2 Add the Client Script we created in step 3.
4.3 Make sure the jQuery External Client Script is at the top the list before pressing OK.
5. Right Click on the Page Control and select HTML Properties.
5.1 Select the jQuery Tab and choose the 'ready' Event.
5.2 Now click on the ... button in the code section and add the following line:
Code: Select all
setFieldTitlesToHelpText($, false);
5.3 Press OK to that and then again to exit the HTML Element Properties dialog.
6. Run the form. If all is configured correctly then your fields should show, the help text will have been hidden and the title attribute of the field controls editor will be changed to the help text (and appears when the mouse hovers over the input).
A big limitation to this method is that the Help Text must be displayed 'to the right of the editor' or the title will be set to blank, and this method may also have some impact when it comes to styling these fields (particularly when they are in a field layout), but that depends on your styling choices.
Hope this is some help to you - there is an example form
here, which you can import to see this in action.
