Dynamically update Angular Bootstrap Calendar widget based on input

[Community Alums]

We are currently using the Angular Bootstrap Calendar widget available from the Developer site in a project. I have configured a sn-record-picker based widget so that a user can select a location from the list and the calendar will filter the contents based on work orders for that location. The calendar widget is receiving the location sys id via broadcast without issue. Where we are struggling is then taking this new value and refreshing/repopulating the calendar based on an input from the widget.

Below is current code:

HTML:

<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
{{::options.title}}
</h2>
</div>
<div class="panel-body" ng-if="c.data.calendarWidget">
<div class="calendar-panel">
<sp-widget widget="data.calendarWidget"/>
</div>
</div>
</div>

Client Script:

function($scope, $rootScope, moment, $window, spModal, spUtil) {
var c = this;

$rootScope.$on('locUpdate', function(event, obj){

c.data.loc = obj.locID;
c.data.calendarWidget = '';
c.server.update();

spUtil.get('angular_bootstrap_calendar', { 'events' : c.data.newEvents,
'id' : 'calendar1',
'show_navigation' : true,
'default_calendar_view' : c.data.defaultCalendarView,
'custom_template_urls' : c.data.customTemplateUrls,
'start_date' : c.data.viewDate }).then(function(response){


c.data.calendarWidget = response;
console.log(data.calendarWidget); //For debugging

});
});

}

Server Script:

if(input){
data.viewDate = new GlideDateTime().toString();
data.defaultCalendarView = 'month';
data.customTemplateUrls = '';
var wm = new GlideRecord('wm_order');
wm.addEncodedQuery('location.sys_idIN' + input.loc);
wm.query();

while(wm.next()){
data.newEvents.push({
title: 'Title: ' + wm.short_description.toString(),
color: { primary : 'red', secondary : 'pink'},
startsAt: wm.expected_start.toString(),
endsAt: wm.estimated_end.toString(),
draggable: true,
resizable: true
});
}

Our theory is that once the new location sys ID has been picked up from the broadcast, this then runs a new GlideRecord query to the Work Order table and populates a new data object called 'newEvents'. We can then use this data  in the client script to build a new widget model with spUtil.get and 'refresh' the HTML. At this point, we are not receiving anything in the response on the client script from this method.

Is there a particular way to achieve this that we have not considered? Any help would be appreciated.

[Anisse Mahtat]

Hi @Community Alums , have you find the answer ?