Add "Remove Picture" option to "User Profile" widget

Peter Bishop
Kilo Expert

I have created a clone of the "User Profile" widget to extend some functionality and would like to add the ability for a user to remove their profile picture. However I haven't managed to make this work. My coding is:

HTML Template:

<button ng-click="uploadNewProfilePicture($event)"
ng-keypress="uploadNewProfilePicture($event)" type="button"
class="btn btn-default send-message">${Upload Picture}</button>
<button ng-click="removeProfilePicture($event)"
ng-keypress="removeProfilePicture($event)" type="button"
class="btn btn-default send-message">${Remove Picture}</button>

Client Script:

$scope.removeProfilePicture = function($event) {
$event.stopPropagation();
snAttachmentHandler.deleteAttachment("live_profile", $scope.data.liveProfileID);
}

Unfortunately this isn't working so I'm guessing I've missed some step - or it just isn't possible. Has anybody performed this activity or can they advise how it can be achieved?

Thanks.

1 ACCEPTED SOLUTION

Bhagyashree8
Kilo Guru

Hi,

add below code in server script part below line 26

		//get profile pic sysId	
	var attachmentGR = new GlideRecord('sys_attachment');
	attachmentGR.addQuery('table_sys_id',data.liveProfileID);
	attachmentGR.addQuery('table_name','ZZ_YYlive_profile');
	attachmentGR.query();
	
	if(attachmentGR.next()){
		data.userPhotoAttachId = attachmentGR.getValue('sys_id');
	}

in client script your function will be like

$scope.removeProfilePicture = function($event) {
		$event.stopPropagation();
		snAttachmentHandler.deleteAttachment($scope.data.userPhotoAttachId).then(function(){
			$scope.reloadPage();
		})
	}

One thing i noticed that it shows deletion after you reload the page 2nd time.But this should get you started.

 

Mark my ANSWER as CORRECT / HELPFUL if it served your purpose.

 

View solution in original post

4 REPLIES 4

Bhagyashree8
Kilo Guru

Hi,

add below code in server script part below line 26

		//get profile pic sysId	
	var attachmentGR = new GlideRecord('sys_attachment');
	attachmentGR.addQuery('table_sys_id',data.liveProfileID);
	attachmentGR.addQuery('table_name','ZZ_YYlive_profile');
	attachmentGR.query();
	
	if(attachmentGR.next()){
		data.userPhotoAttachId = attachmentGR.getValue('sys_id');
	}

in client script your function will be like

$scope.removeProfilePicture = function($event) {
		$event.stopPropagation();
		snAttachmentHandler.deleteAttachment($scope.data.userPhotoAttachId).then(function(){
			$scope.reloadPage();
		})
	}

One thing i noticed that it shows deletion after you reload the page 2nd time.But this should get you started.

 

Mark my ANSWER as CORRECT / HELPFUL if it served your purpose.

 

Hi.

Thanks for the information and that really helped. One thing I am noticing is that the picture does get removed from the sys_attachment table but the picture continues to be displayed in the profile. I've tried logging out, restarting the browser, trying a different browser, etc.

Any thoughts on where it might also be stored?

Thanks again.

for me it is removed,

 

it gets deleted from attachment table and its not visible on live_profile record, but somehow it still loads some dummy blank image.

 

Mark my ANSWER as CORRECT / HELPFUL if it served your purpose.

 

for me it is not visible but some blank image is coming.

find_real_file.png

It is removed from attachment table and live_profile record but someone servicenow API still fetches some dummy image.

below code fetches the image.

find_real_file.png