I am wondering if there is a way to make a custom field look like the OOB Duration field. I have a group that wants to track the total number of days its team members travel, but do not like the way that the standard Duration field looks on reports (from task_time_worked table) since they care only about total days and don't want to track Hours, Minutes and Seconds. You and specify a minimum value for duration of course, but I don't believe there is a way to go the opposite direction (and if I'm not mistaken, reports will ignore that attribute anyway).
I created a custom Decimal field on my custom table extending Task and am populating another custom Decimal field on task_time_worked via business rules. What I'm looking for though is to style my form field that I created to track days so that it would look very similar to the Duration field in appearance:
Duration:
Desired appearance for custom field:
Ok, was doing just that before your reply. Worked on it a bit and ended up with the following code in a UI Macro that is related to a Formatter and pretty much got the result that I want visually by associating a UI Macro to a Formatter and then placing the Formatter on the form:
The issue that I'm having now though is that adding any values to the formatter field doesn't really do anything. On save/update the field is returned to a blank value and the actual field I want to populate "u_traveldays" doesn't update. I'm sure after looking at other UI Macros (I was looking at "ui_input_field" as an example) that I need to use Jelly to actually populate the field, but I'm not familiar with Jelly enough to really just look at the example and build something quickly from it, so wondering if anyone here has any pointers to make this work. Also wondering if I have to rewrite HTML for Jelly, or if I can use it basically as is with Jelly making the calls, etc.
Below is the HTML that got the result above in the formatter:
<div class="form-group " style="" id="element.u_gst_aar.u_traveldays">
<div noWrap="true" data-type="label" id="label.u_gst_aar.u_traveldays" choice="0" type="glide_duration" class="">
<label for="u_gst_aar.u_traveldays" dir="ltr" class=" col-xs-12 col-md-3 col-lg-4 control-label" onclick="return labelClicked(this);">
<span id="status.u_gst_aar.u_traveldays" title="" mandatory="false" class=" required-marker" oclass="" aria-label=""></span>
<span title="" class="label-text" data-html="false">Travel days</span></label></div>
<div class="col-xs-10 col-sm-9 col-md-6 col-lg-5 form-field input_controls">
<input name="sys_original.u_gst_aar.u_traveldays" id="sys_original.u_gst_aar.u_traveldays" type="hidden"></input>
<div class="row"><span id="u_gst_aar.u_gst_aar.u_traveldays"></span>
<div class="col-xs-5 col-sm-12 col-md-12 col-lg-4 no-right-padding-lg">
<div class="input-group input-group-1">
<span class="input-group-addon"><label for="ni.u_gst_aar.u_gst_aar.u_traveldays">Days</label></span>
<input name="ni.u_gst_aar.u_gst_aar.u_traveldays" data-type="u_gst_aar.u_gst_aar.u_traveldays_decimal_field" id="ni.u_gst_aar.u_gst_aar.u_traveldays"
type="text" title="Days" class="form-control"></input></div></div></div></div>
<input data-ref="u_gst_aar.u_gst_aar.u_traveldays" name="u_gst_aar.u_gst_aar.u_traveldays" data-type="decimal" id="u_gst_aar.u_traveldays" type="hidden"
data-max-level="4" data-disabled="false"><div class="col-xs-2 col-sm-3 col-lg-2 form-field-addons"></div></input></div>
And below is the "ui_input_field" UI Macro as comparison:
<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="true" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null">
<g:macro type="text" name="REQUIRED" label="REQUIRED" value="" onkeyup="" onchange="onChange('${jvar_name}');" onclick_label="" mandatory="false" size="" style="" readonly="false" maxlength=""/>
<table>
<tr>
<td height="23px" id="label.${jvar_name}" class="label" nowrap="true" type="string" choice="0" oncontextmenu="${jvar_oncontextmenu}">
<g:form_label onclick="${jvar_onclick_label}" for="${jvar_name}"> ${jvar_label}<j2:if test="$[GlideMobileExtensions.getDeviceType() != 'doctype']">:</j2:if></g:form_label>
</td>
<td nowrap="true" style="${jvar_style};">
<j:if test="${jvar_readonly == 'false'}">
<input type="${jvar_type}" name="${jvar_name}" id="${jvar_name}" value="${jvar_value}" onkeyup="${jvar_onkeyup}" onchange="${jvar_onchange}" size="${jvar_size}" style="${jvar_style}" maxlength="${jvar_maxlength}" autocomplete="off" autocorrect="off" />
</j:if>
<j:if test="${jvar_readonly == 'true'}">
<input autocomplete="off" autocorrect="off" type="${jvar_type}" readonly="readonly" name="${jvar_name}" id="${jvar_name}" value="${jvar_value}" onkeyup="${jvar_onkeyup}" onchange="${jvar_onchange}" size="${jvar_size}" style="border:0px;background:transparent" maxlength="${jvar_maxlength}"/>
</j:if>
</td>
</tr>
</table>
</j:jelly>
One last thing as well, I'm not sure if I need to define a script to associate with the onChange('${jvar_name}'); section to update the actual field, which I assume would be hidden on the form.
