Widget/Modal help

[magee]

I posted a question last week to help get me started with a portal (custom) widget and I was able to get the data from the client to the server (run a script include) and then spit back a value from the script include.

Looking at it further, now I want to display that script include response in a pop up modal. Here's the flow I'm looking to perform:

I'm getting the modal to appear when the form loads. I'd like the modal to appear every time the location changes.

Also, I want to display the result from the script include in the modal pop up.

PS: this is new territory for me

Here's my widget code so far:

HTML
<div ng-if="c.data.scriptIncludeResult != '-1'">
<div ng-init="c.onOpen()">
</div>
</div>

//Server

(function() {
    if (input && input.location) {
        data.catItem = $sp.getParameter('sys_id');
        var myUtil = new global.catalogHelper();
        data.scriptIncludeResult = myUtil.calculateEstimatedDelivery(input.location, data.catItem);
        gs.info('Location: ' + data.scriptIncludeResult); //for testing purposes, i'm hard coding a return a value of '5' from the script include
    }
})();

//Client controller

api.controller = function($scope, spModal) {
    var c = this;

    $scope.$watch(function() {
        return $scope.page.g_form.getValue('location');
    }, function(value, oldValue) {
        if (value != oldValue) {
            c.data.location = value;
            c.server.update().then(function(response) {});
        }
    });

    c.onOpen = function() {
		
        var message = c.data.scriptIncludeResult;
        spModal.open({
            title: 'Estimated Delivery',
            message: message,
            buttons: [{
                label: 'OK',
                primary: true
            }]
        });
    };
};

[palanikumar]

Hi,

Call c.onOpen inside the server.update

//Client controller

api.controller = function($scope, spModal) {
    var c = this;

    $scope.$watch(function() {
        return $scope.page.g_form.getValue('location');
    }, function(value, oldValue) {
        if (value != oldValue) {
            c.data.location = value;
            c.server.update().then(function(response) { c.onOpen; });
        }
    });

    c.onOpen = function() {
		
        var message = c.data.scriptIncludeResult;
        spModal.open({
            title: 'Estimated Delivery',
            message: message,
            buttons: [{
                label: 'OK',
                primary: true
            }]
        });
    };
};

[magee]

Hi Palani-

Still no worky. The modal still only pops up on load

[magee · Accepted solution]

Got it working.

I'm gathering the value of the 'location' variable on the catalog item. The client controller captures the value every time the value of location changes.

It then passes the location value to the server script.

In the server script I'm getting the sys_id of the catalog item from the URL.

I'm then passing the catalog item sys_id and location id to the script include.

The script does some stuff and passes back a value.

That value is then spit back over the client script which is put in a modal to display.

Server script

(function() {
var id = $sp.getParameter('sys_id');
var location = input.location;
doSomething(location,id);

function do Something(location,id){
var myUtil = new global.catalogHelper();
data.scriptIncludeResult = myUtil.calculateEstimatedDelivery(location,id);
data.message = data.scriptIncludeResult;
}
})();

Client controller:

api.controller = function($scope, spModal){
var c = this;
$scope.$watch(function() {
return $scope.page.g_form.getValue('location');
}, function(newValue !== oldValue) {
if(newValue)
c.data.location  newValue;
c.data.action = 'getSomething';
c.server.update().then(function(){
var returnValue = c.data.message;
if(returnValue > '0') {
goToModal(c.data.message);
}
function goToModal(value){
spModal.open({
title: 'Estimated Delivery',
message: 'Estimated delivery for this locaiton for this catalog item is: ' + value,
buttons: [{
label: 'OK',
primary: true
}]
});
}
});
}
});
};