Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

Attachment widget not uploading file

Community Alums
Not applicable

Hi All,

I have created an attachment widget to use it as a variable in a catalog item. We are able to select the file but the file upload is not happening.Can anyone help me to identoiy the issue?

HTML

<div id="sc_cat_item" >

         

                          </div>

                          <now-attachments-list template="sp_attachment_single_line" ></now-attachments-list>

                         

                          <label style="float:left;font-weight:normal;cursor:pointer;"><sp-attachment-button></sp-attachment-button><span style="padding-left:4px;">${please fill them in excel and attach it to this request.}<br>Click <a>here</a> to add an attachment</span></label>

  <sp-message-dialog name="delete_attachment"

                                            title="{{m.dialogTitle}}"

                                            message="{{m.dialogMessage}}"

                                            ok="{{m.dialogOK}}"

                                            cancel="{{m.dialogCancel}}"

                                            dialog-class="delete-dialog"/>

Client Script

function ($scope, $http, spUtil, nowAttachmentHandler, $rootScope, $sanitize, $window, $sce) {

  var c = this;

  c.quantity = 1;

  $scope.data.sc_cat_item.description = $sce.trustAsHtml($scope.data.sc_cat_item.description);

  $scope.m = $scope.data.msgs;

  $scope.submitButtonMsg = $scope.m.submitMsg;

  var ah = $scope.attachmentHandler = new nowAttachmentHandler(setAttachments, function() {});

  ah.setParams('sp_portal', $scope.data._attachmentGUID, 1024 * 1024 * 24);

  function setAttachments(attachments, action) {

  $scope.attachments = attachments;

  }

  $scope.attachmentHandler.getAttachmentList();

  $scope.confirmDeleteAttachment = function(attachment, $event) {

      $rootScope.$broadcast("dialog.delete_attachment.show", {

          parms: {

              ok: function() {

                  $scope.attachmentHandler.deleteAttachment(attachment);

                  $rootScope.$broadcast("dialog.delete_attachment.close");

              },

              cancel: function() {

                  $rootScope.$broadcast("dialog.delete_attachment.close");

              },

              details: attachment.name

          }

      })

  }

}

Server Script

// populate the 'data' variable with catalog item, variables, and variable view

(function() {

  var m = data.msgs = {};

  m.submitMsg = gs.getMessage("Submit");

  m.submittedMsg = gs.getMessage("Submitted");

  m.createdMsg = gs.getMessage("Created");

  m.trackMsg = gs.getMessage("track using 'Requests' in the header or");

  m.clickMsg = gs.getMessage("click here to view");

  m.dialogTitle = gs.getMessage("Delete Attachment");

  m.dialogMessage = gs.getMessage("Are you sure?");

  m.dialogOK = gs.getMessage("OK");

  m.dialogCancel = gs.getMessage("Cancel");

  if (input)

  data.sys_id = input.sys_id;

  else

  data.sys_id = $sp.getParameter("sys_id") || $sp.getParameter('sl_sys_id');

  data._attachmentGUID = gs.generateGUID();

  // portal can specify a catalog home page

  data.sc_catalog_page = $sp.getDisplayValue("sc_catalog_page") || "sc_home";

  var validatedItem = new GlideappCatalogItem.get(data.sys_id);

  if (!validatedItem.canView())

  return;

})()

Thanks and Regards,

Kirti

1 ACCEPTED SOLUTION

larstange
Mega Sage

You need to clone the widget to modify it. Below is my best guess - i haven't tested the code, but are using something similar in my end.



Then add this line in the client script



//Send attachment guid variable widgets - wait for the widgets to load


setTimeout(function(){ $rootScope.$broadcast('sp.rp.attachguid', $scope.data._attachmentGUID); }, 1000);



In your own widget add a listener - and initialize the attachment handler in this


//Listen for the attachment GUID


$scope.$on('sp.rp.attachguid', function(e,guid) {


  $scope.data._attachmentGUID = guid;


  var ah = $scope.attachmentHandler = new nowAttachmentHandler(setAttachments, function() {});


  ah.setParams('sp_portal', $scope.data._attachmentGUID, 1024 * 1024 * 24);


  function setAttachments(attachments, action) {


  $scope.attachments = attachments;


  }


  $scope.attachmentHandler.getAttachmentList();


});



Remove the line generating the guide in the server script



data._attachmentGUID = gs.generateGUID();


View solution in original post

16 REPLIES 16

Hi Tange,



I tried with your script, it is uploading the files but not copying to the request table.



thanks and regards


Swamy


if i remove data._attachmentGUID = gs.generateGUID(); in server script, then the below line will not work.



setTimeout(function(){ $rootScope.$broadcast('sp.rp.attachguid', $scope.data._attachmentGUID); }, 1000);



$scope.$on('sp.rp.attachguid', function(e,guid) {


  $scope.data._attachmentGUID = guid;


  var ah = $scope.attachmentHandler = new nowAttachmentHandler(setAttachments, function() {});


  ah.setParams('sp_portal', $scope.data._attachmentGUID, 1024 * 1024 * 24);


  function setAttachments(attachments, action) {


  $scope.attachments = attachments;


  }


  $scope.attachmentHandler.getAttachmentList();


});


hi, i'm having the same issue as you, were you able to fix this?

Community Alums
Not applicable

worked like charm thank you


Kirti,



What does the complete solution look like? I created the widget but not sure where to add the listener code mentioned by Tange.



Thanks