Hi,

Most recently I tried to use the glide list and apparently the “macro” available is using the old version. Gosh no.

In order to improve it, I have created the following UI macro.

Name: GlideList2

Description: This is an optimized Glide List   ready for bootstrap. It was based on old macro lightweight_glide_list and recent HTML code.

Code:

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<g:evaluate var="jvar_current_user" expression="gs.getUserDisplayName()" />

<g:evaluate var="jvar_current_user_id" expression="gs.getUserID()" />

<!-- start bootstrap --> 

   <button data-original-title="Edit ${jvar_label}" id="${jvar_control_name}_unlock" data-target="#glide\.${jvar_control_name}" data-placement="auto" title="" data-auto-close="false" style="margin-right: 5px; display: inline-block;" data-type="glide_list_unlock" tabindex="0" class="btn btn-default btn-ref" data-ref="${jvar_control_name}">

   <span aria-hidden="true" class="icon icon-locked"></span>

   <span class="sr-only">Edit ${jvar_label}</span>

   </button>

   <!-- start mode edit -->

   <span id="${jvar_control_name}_edit" style="display: none;">

     <div class="glide-list">

     <select id="select_0${jvar_control_name}" style="direction:ltr; ;" name="select_0${jvar_control_name}" onchange="toggleGlideListIcons('${jvar_control_name}', false);" class="form-control" multiple="yes" size="6"></select>

     <div class="button-column">

     <j:if test="${jvar_can_add_me}">

     <button data-original-title="Add me" id="add_me.${jvar_control_name}" title="" data-user-id="${jvar_current_user_id}" style="display: inline-block;" data-type="glide_list_add_me" class="btn btn-default btn-ref" data-user="${jvar_current_user}" data-ref="${jvar_control_name}">

     <span aria-hidden="true" class="icon-user-add icon"></span><span class="sr-only">${jvar_label} Add me</span>

     </button>

     </j:if>

     

     <button data-original-title="Remove selected item" disabled="" id="remove.${jvar_control_name}" class="btn btn-default btn-ref" title="" style="display: inline-block;" data-type="glide_list_remove" data-ref="${jvar_control_name}">

     <span aria-hidden="true" class="icon icon-cross"></span>

     <span class="sr-only">Remove selected item</span>

     </button>

     <button data-original-title="View selected item" disabled="" id="view2link.${jvar_control_name}" title="" onmouseout="lockPopup(event)" name="view2.${jvar_control_name}" tabindex="-1" onclick="glideListViewSelection('${jvar_control_name}','deapr_glide','sys_user', 'false')" class="btn btn-default btn-ref" type="button" onmouseover="glideListPopupSelection(event, '${jvar_control_name}', 'sys_user')"><span aria-hidden="true" class="icon-view icon"></span>

     <span class="sr-only">View selected item</span>

     </button>

     

     <button data-original-title="Lookup using list" id="lookup.${jvar_control_name}" onclick="reflistOpen( '${jvar_control_name}','select_0${jvar_control_name}','${jvar_table}','null', 'false', ''); mousePositionSave(event); event.stop();" class="btn btn-default btn-ref" title="" name="lookup.{{ref}}">

   <span aria-hidden="true" class="icon icon-search"></span><span class="sr-only">Lookup using list</span>

   </button>

     <button data-original-title="Lock" id="${jvar_control_name}_lock" title="" style="align: left; padding-top: 3px; cursor: pointer; display: none" data-type="glide_list_lock" tabindex="0" class="btn btn-default btn-ref" type="button" data-ref="${jvar_control_name}">

     <span aria-hidden="true" class="icon icon-unlocked"></span><span class="sr-only">Lock"</span>

     </button>

     </div>

     </div>

   </span>

<!-- finish edit -->

<p data-original-title="${jvar_label}" id="${jvar_control_name}_nonedit" class="form-control-static" title="" style="direction:ltr; display: inline-block; "></p>

<input mandatory="false" id="${jvar_control_name}" value="" name="${jvar_control_name}" type="HIDDEN" />

<!--

<input value="" id="sys_original.${jvar_control_name}" name="sys_original.${jvar_control_name}" type="HIDDEN" />

 -->

<!-- finish bootstrap -->

<!-- End List -->

</j:jelly>

On your UI page, you just need to invoke it.

<!-- List -->	
<j:set var="jvar_label" value="Users" />

<j:set var="jvar_control_name" value="zListCollectorUsers" />

<j:set var="jvar_can_add_me" value="true" />

<j:set var="jvar_table" value="sys_user" />

<g:macro_invoke macro="GlideList2" />