Hello Everyone,
I need to add a checkbox beside a table's form field (e.g. Incident form), as shown in the below screenshot.
The value of this checkbox (true/false) needs to be captured as current variable.
That is, if the checkbox field's name is u_select_all - then, current.u_select_all should read the value.
What is the easiest way of doing this? Please help.
Hello Everyone,
I have implemented this solution by myself, with little help from around the community.
So, for everyone's help, I am just posting here what I have done.
At the end of the day, this was not that difficult, once you know little bit of HTML and plain-old JavaScript.
The solution is given below:
1st Step - develop a UI Macro:
Give a name to this macro, e.g.
service_offering_select_all<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<div style="padding: 5px;"
title="Click here to list all service offerings">
<input type="checkbox" id="u_select_all" name="u_select_all"
style="margin-right: 5px;width: 15px; height: 15px;"
onclick="listAll(this.checked);"/>
<label style="vertical-align: 2.5px; font-style: italic;">List All</label>
</div>
<script>
function listAll(flag){
if(flag == true)
g_form.setValue('u_select_all', true); // explained in Step-3
else
g_form.setValue('u_select_all', false); // explained in Step-3
}
</script>
</j:jelly>
What the above macro does is basically create a HTML checkbox and a JavaScript function, that will be called when user checks/unchecks the checkbox.
2nd Step - Hook up the UI Macro with the Form field (server-side table)
For doing this, right-click on the field and go to Configure Dictionary.
Then in Attributes, simply add this:
ref_contributions=service_offering_select_all
Screenshot is also given here.
Whatever you are writing after ref_contributions is basically the name of the UI macro defined above.
3rd Step - Create a True/False field in the Form (table column) and keep it hidden and read-only
Simply create a new field, name that I've given - u_select_all (DB column name).
Through a UI Policy defined on this table, just make this field Read-only and Hidden.
How the above steps come together?
Now, the checkbox in the UI macro is purely client-side.
But I want to capture what user is doing in this checkbox within the form and then pass it on to my server-side script. So, how to do that? Very simple, as explained below.
Go back to the UI macro JavaScript function, and see the 2 lines I've commented with 'explained in Step-3'
- When user checks the macro's checkbox, the u_select_all value is set to True;
- When user unchecks the macro's checkbox, the u_select_all value is set to False.
This true/false value of the form's or table's field can now be used very easily in a server-side script by simply passing it as an argument/parameter to a script include code.
Hope this will be helpful for all of you.
For more variations and advanced level UI Macro knowledge, please view the below documentation page:
You can also refer to the below page for some quick insights in jelly scripting.
https://gist.github.com/nguyen0096/4d7f239689be0aac559c75b73acfdcb2
Keep sharing; knowledge grows when you share it !!!
