Clicking Modal Widget has no link, void(0)

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-06-2019 12:16 PM
Hi,
I have a service portal that has a modal widget. I have added the link properly but when I click to test it the result is void(0). To verify I copied the link and tried to open in a new tab but it is void(0). Overall is not brining the URL link I have in the widget. I appreciate any help to resolve this issue??
- Labels:
-
Service Portal
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-06-2019 12:21 PM
Hi,
I think it is a custom widget. To provide better suggestions, can you paste the code? Also, remove if there is any confidential or proprietary code.

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-06-2019 12:33 PM
Here is the code
HTML
<div>
<!--// Top Icon -->
<a href="javascript:void(0)" ng-if="::(options.link_template == 'Top Icon' || !options.link_template)" ng-click="c.openFormModal()" class="top_icon {{::options.class_name}} link" target="{{::data.target}}">
<div class="m-b fa fa-{{::options.glyph}} fa-4x {{::options.class_name}} text-{{::options.color}}"></div>
<h3>{{::options.title}}</h3>
<span class="text-muted">{{::options.short_description}}</span>
</a>
<!--// Circle Icon -->
<a href="javascript:void(0)" ng-if="::(options.link_template == 'Circle Icon')" ng-click="c.openFormModal()" class="circle_icon {{::options.class_name}} text-{{::options.color}} link" target="{{::data.target}}">
<span class="fa fa-stack fa-2x">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-{{::options.glyph}} fa-stack-1x fa-inverse"></i>
</span>
<h3>{{::options.title}}</h3>
<span class="text-muted">{{::options.short_description}}</span>
</a>
<!--// Color Box -->
<a href="javascript:void(0)" ng-if="::(options.link_template == 'Color Box')" ng-click="c.openFormModal()" class="color_box {{::options.class_name}} icon-link-background-{{::options.color}} text-white link" target="{{::data.target}}">
<div class="fa fa-{{::options.glyph}} fa-3x {{::options.class_name}}"></div>
<h3>{{::options.title}}</h3>
<span>{{::options.short_description}}</span>
</a>
<div id="modal_instance_container">
<sp-widget widget="c.modalInstance" ng-if="c.modalInstance"></sp-widget>
</div>
</div>
CSS
/* TOP ICON ---------- */
a.top_icon {
display: block;
padding: 20px;
text-align: center;
}
a.top_icon .fa {
display: block;
text-align: center;
}
a.top_icon h3 {
font-weight: 300;
padding: 0;
margin: 0 0 10px 0;
}
/* CIRCLE ICON ---------- */
a.circle_icon {
display: block;
padding: 20px 0px 20px 70px;
position: relative;
}
a.circle_icon .fa {
position:absolute;
left: 0px;
top: 10px;
}
a.circle_icon h3 {
font-weight: 300;
padding: 0;
margin: 0 0 10px 0;
}
/* COLOR BOX ---------- */
a.color_box {
display: block;
position: relative;
padding: 20px 20px 20px 82px;
border-radius: 4px;
margin-bottom: 20px;
}
a.color_box .fa {
position:absolute;
left: 20px;
top: 20px;
width:42px;
text-align: center;
}
a.color_box h3 {
font-weight: 300;
padding: 0;
margin: 0 0 10px 0;
}
.icon-link-background-primary {
background-color: $brand-primary;
}
.icon-link-background-info {
background-color: $brand-info;
}
.icon-link-background-success {
background-color: $brand-success;
}
.icon-link-background-warning {
background-color: $brand-warning;
}
.icon-link-background-danger {
background-color: $brand-danger;
}
.icon-link-background-default {
background-color: $brand-primary;
}
.link {
cursor:pointer;
}
Server script
(function(){
var gr = $sp.getInstanceRecord();
//data.href = $sp.getMenuHREF(gr);
data.target = options.target || "";
data.table = options.table_name;
data.view = options.view;
data.query = options.query;
data.sys_id = options.record_sysid;
})();
Client controller
function($scope, $rootScope, $location, $window, spUtil) {
/* widget controller */
var c = this;
c.openFormModal = function(type) {
var myCtrl;
c.modalInstance = undefined;
var data = {
embeddedWidgetId: 'widget-form',
embeddedWidgetOptions: {
table: c.data.table,
sys_id: c.data.sys_id || -1,
query: c.data.query,
view: c.data.view
}
};
spUtil.get('widget-modal', data).then(function(widget){
widget.options.afterClose = function(){
c.modalInstance = undefined;
};
widget.options.afterOpen = function(controller){
myCtrl = controller;
};
c.modalInstance = widget;
});
var unregister = $scope.$on('sp.form.record.updated', function(event, savedOptions){
closeModal();
$rootScope.$broadcast('apm-'+c.options.table_name+'-created');
});
function closeModal(){
if(myCtrl)
myCtrl.close();
if(c.modalInstance)
c.modalInstance = undefined;
/* Hack to prevent widget-form adding recently created record sys_id in url */
var params = $location.search();
if(params.sys_id || params.spa) {
if(params.sys_id)
delete params.sys_id;
if(params.spa)
delete params.spa;
$location.search(params).replace();
}
}
};
}
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-06-2019 01:00 PM
Hi,
Try with below
<div>
<!--// Top Icon -->
<a ng-href="{{::data.target}}" ng-if="::(options.link_template == 'Top Icon' || !options.link_template)" ng-click="c.openFormModal()" class="top_icon {{::options.class_name}} link" target="{{::data.target}}">
<div class="m-b fa fa-{{::options.glyph}} fa-4x {{::options.class_name}} text-{{::options.color}}"></div>
<h3>{{::options.title}}</h3>
<span class="text-muted">{{::options.short_description}}</span>
</a>
<!--// Circle Icon -->
<a ng-href="{{::data.target}}" ng-if="::(options.link_template == 'Circle Icon')" ng-click="c.openFormModal()" class="circle_icon {{::options.class_name}} text-{{::options.color}} link" target="{{::data.target}}">
<span class="fa fa-stack fa-2x">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-{{::options.glyph}} fa-stack-1x fa-inverse"></i>
</span>
<h3>{{::options.title}}</h3>
<span class="text-muted">{{::options.short_description}}</span>
</a>
<!--// Color Box -->
<a ng-href="{{::data.target}}" ng-if="::(options.link_template == 'Color Box')" ng-click="c.openFormModal()" class="color_box {{::options.class_name}} icon-link-background-{{::options.color}} text-white link" target="{{::data.target}}">
<div class="fa fa-{{::options.glyph}} fa-3x {{::options.class_name}}"></div>
<h3>{{::options.title}}</h3>
<span>{{::options.short_description}}</span>
</a>
<div id="modal_instance_container">
<sp-widget widget="c.modalInstance" ng-if="c.modalInstance"></sp-widget>
</div>
</div>

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-06-2019 01:15 PM