I have a UI page where two reference are present and i want one of the reference field query updated once the other one is selected
HTML Script:
<?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_sysparm_category" jelly="true" expression="RP.getParameterValue('sysparm_category')"/>
<div class="form-group" style="margin-left:16px !important;margin-right:16px !important">
<label style="font-size: 15px;"> Assigned to </label>
<g:ui_reference name="user" id="user" table="sys_user" query="active=true" completer="AJAXTableCompleter" columns="user_name" onchange="checkUserAndToggle()"/>
</div>
<input type="hidden" id="category" name="category" value="${sysparm_category}"/>
<!--j:if test="${jvar_sysparm_category == 'LED Monitor Screen' || jvar_sysparm_category == 'Docking Station' }"-->
<div id="floor_group" class="form-group"
style="margin-left:16px !important;margin-right:16px !important; display:none;"
>
<label style="font-size: 15px;"> Location </label>
<g:ui_reference name="location" id="location" table="cmn_location" query="" completer="AJAXTableCompleter" columns="name" onchange="checkFloorAndToggle()"/>
</div>
<div id="meeting_group" class="form-group" style="margin-left:16px !important;margin-right:16px !important; display:none;">
<label style="font-size: 15px;"> Floor </label>
<g:ui_reference name="floor" id="floor" table="u_meeting_rooms" completer="AJAXTableCompleter" columns="u_name" query=""/>
</div>
<!--/j:if-->
<j:if test="${jvar_sysparm_category == 'Desktop' || jvar_sysparm_category == 'Laptop' }">
<div class="form-group" style="margin-left:16px !important;margin-right:16px !important">
<label style="font-size: 15px;"> Hostname </label>
<input type="text" id="hostname" name="hostname" size ="35" class="form-control" />
</div>
<div class="form-group" style="margin-left:16px !important;margin-right:16px !important">
<label style="font-size: 15px;"> Asset Info </label><br/>
<g:ui_choicelist name="asset_info" id="asset_info" table="alm_asset" query="active=true" field="u_asset_info"/>
</div>
</j:if>
<br/>
<div style="text-align: right;width: 100%;"><button class="btn btn-primary" onclick="forward()" type="submit" >Submit</button></div>
<script>
// Put the sys_ids of the users that should reveal the Floor Detail
// Example: ['62826bf03710200044e0bfc8bcbe5df1', '6816f79cc0a8016401c5a33be04be441']
var SHOW_FLOOR_FOR_USER_SYSIDS = [
'ac9972653b36ead0839a92dc73e45abf'
];
function checkUserAndToggle() {
// var userId = (document.getElementById('user') || {}).value || '';
var userId = document.getElementById('user').value
//alert(document.getElementById('user').value);
var floorGroup = document.getElementById('floor_group');
var floorGroup2 = document.getElementById('meeting_group');
if (!userId || !floorGroup) { floorGroup.style.display = 'none'; return; }
var ga = new GlideAjax('KGSIT_CatalogClientUtils');
ga.addParam('sysparm_name', 'asset_floor');
ga.addParam('sysparm_user_id', userId);
ga.getXMLAnswer(function(answer) {
floorGroup.style.display = (answer === 'true') ? 'block' : 'none';
floorGroup2.style.display = 'block';
});
}
function checkFloorAndToggle(){
var location = document.getElementById('location').value
//alert(location);
//alert(document.getElementById('user').value);
var floorGroup = document.getElementById('meeting_group');
var floor = document.getElementById('floor');
if (!location || !floorGroup) { floorGroup.style.display = 'none'; return; }
if(location){
alert(location);
//var floorRef = document.getElementById('floor');
floor.setAttribute('query', 'u_location=' + location);
//floorGroup.style.display = 'block';
//var qual = location ? ('u_location=' + location) : 'u_nameISNOTEMPTY';
// Update the attribute; for most reference widgets the completer will pick it up next open
//qualifyMeetingRoomsByLocation(location);
}
}
function qualifyMeetingRoomsByLocation(locationSysId) {
alert(locationSysId);
// This works on UI Pages by updating the 'query' attribute and forcing a refresh
var floorRef = document.getElementById('floor');
var qual = locationSysId ? ('u_location=' + locationSysId) : 'u_nameISNOTEMPTY';
// Update the attribute; for most reference widgets the completer will pick it up next open u_location=89e0e2cedb5e2010401c010bd3961938
//floorRef.query(qual);
floorRef.setAttribute('query', 'u_location=' + locationSysId);
//floorRef.setAttribute('query', qual);
}
(function init(){ checkUserAndToggle(); })();
//(function init(){ checkFloorAndToggle(); })();
</script>
</j:jelly>
