Service Portal: Embed Form Widget in a Modal

kurtbell1
Giga Expert

Hi there - I am trying to embed a form widget within a modal widget.   In this case it's a "New" button and I want to have the button bring up a Modal to create a new Task.   The modal is coming up fine and it looks like the Form widget is embedding, but its not rendering the Form.   I just get a "Record not found" message.   I'm sure it has to do with the "widgetInput" parameter below, but based on the documentation i saw on Git it looks like I'm doing this correctly (even thought I'm clearly not).

Does anyone have a suggestion for what I'm doing wrong?

find_real_file.png

find_real_file.png

find_real_file.png

1 ACCEPTED SOLUTION

sndangibbard
Mega Guru

Hi Kurt,


What you have there is perfectly correct from a technical perspective, after a bit of investigation I've discovered that the sys_id parameter is not actually getting passed over in your widgetInput object - for some reason it is getting stripped out! You can verify this yourself if you clone the Form widget and modify it to log out the $scope data.



So the best solution I can find is to follow that route, if your requirement is only to open a new form then make a clone of the Form Widget and call that clone in your modal instead. In the Server script of your cloned Widget, force it to use -1 as its sys_id


sys_id.PNG



Hope this helps despite it not being a particularly elegant solution!


View solution in original post

5 REPLIES 5

sndangibbard
Mega Guru

Hi Kurt,


What you have there is perfectly correct from a technical perspective, after a bit of investigation I've discovered that the sys_id parameter is not actually getting passed over in your widgetInput object - for some reason it is getting stripped out! You can verify this yourself if you clone the Form widget and modify it to log out the $scope data.



So the best solution I can find is to follow that route, if your requirement is only to open a new form then make a clone of the Form Widget and call that clone in your modal instead. In the Server script of your cloned Widget, force it to use -1 as its sys_id


sys_id.PNG



Hope this helps despite it not being a particularly elegant solution!


Is there any fix for this issue



I have the same issue. I want to open a modal with a knowledge article but the sys_id parameter is not passed to the widget. The article will be different.


Hi Tommy,

 

Did you get any solution to your issue? I am stuck with the same.. 

Regards.

ryan_pope
Mega Guru

I haven't seen any updates to this, but figured I'd share a similar requirement and how I resolved:

In the html, I use the ng-click to pass over the -1 sys-id. This function then also works later on, when I have a separate button using the same function, but passes an existing sys_id: 

<div ng-if="!c.data.existing_open_activity" class="col-sm-12 col-md-12">
        <div class="panel panel-default b card">
          <div class="card-body title title-heading start-time" ng-click="existingRecordModal(-1)">
            <div>
              <span><strong>Create New</strong></span>
              <i class="fa fa-plus-circle start-green"></i>
            </div>           
<div ng-repeat="activity in data.existing_open_activity">
         <div class="panel panel-default b card">
            <div class="card-body">
               <div>
                 <table style="width:100%">
                   <tr>
                     <td class="link" ng-click="existingRecordModal(activity.sys_id)"><strong>{{activity.number}}</strong></td>
                     <td><strong>Customer:</strong> {{activity.customer}}</td>
              		 	 <td><strong>Activity:</strong> {{activity.activity}}</td>                
                		</tr>
                 </table> 
               <div>

Then, in the client script, I use the function parameter to set the sys_id in the widgetInput parameter:

$scope.existingRecordModal = function(activitySys) {
		c.modalInstance = spModal.open({
				widget: 'widget-form',
				title: 'Time Activity',
				buttons: [],
				widgetInput: {
					table: 'x_kror_managed_ser_time_analysis',
					sys_id: activitySys,
					view:'sp'
				}
			}).then(function() {
					c.server.update().then(function(response) {
						spUtil.update($scope);
					});
			});
	};