Cireson Partners, Customers and Community members share your customizations and examples here to help benefit the community as a whole to earn Kudos and badges.
DISCLAIMER
All files and projects located here are provided and come "as-is" and without any warranty or support. Use at your own risk. Your use of Community Uploads is subject to our Terms of Use.
Cireson does not and will not support or maintain these enhancements, extensions, and scripts.
For Team Cireson uploads click here.
(small) Date Created, Last Modified and Resolved on WI forms
Konstantin_Slavin-Bo
Customer Ninja IT Monkey ✭✭✭✭
This is a very small piece of code, which is based on an idea and design by @Adrian_Mataisz (upvote his feature request here, if you want to have this OotB) and with the help of @Tom_Hendricks. Thanks for the idea and help! I thought I would post here for visibility, for anyone who is missing this info.
It adds the Created date, Last Modified date and Resolved date to the head line on IR forms (see the bottom of this post for other classes), like this:
The code code should be placed in
For other classes, replace
The original feature requests includes adding information about Created By, Last Modified By and Resolved By, but even though I can find CreatedBy quite easily, the two other properties are not set on the IR object itself (I can't find them at least), so it would require fetching the object through the API. I feel like this approach would be to heavy simply to display that information, so I have not included any of the "by" fields. If anyone is interested in those fields, please say so, and maybe we can have a look at it anyways.
It adds the Created date, Last Modified date and Resolved date to the head line on IR forms (see the bottom of this post for other classes), like this:
The code code should be placed in
custom.js and custom.css respectively:custom.jsapp.custom.formTasks.add('Incident', null, function (formObj, viewModel) {<br> //bind a function to the form ready event<br> formObj.boundReady(function () {<br><br> // Convert dates to locale if they are not empty<br> var createdDate = viewModel.CreatedDate ? (new Date(viewModel.CreatedDate)).toLocaleString() : '--';<br> var lastModified = viewModel.LastModified ? (new Date(viewModel.LastModified)).toLocaleString() : '--';<br> var resolvedDate = viewModel.ResolvedDate ? (new Date(viewModel.ResolvedDate)).toLocaleString() : '--';<br> <br> // Build div with dates<br> var datesDiv = '<div class="headingFields"><span class="headingFieldLabel">Created:</span>' + createdDate +<br> '<span class="headingFieldLabel">Last Modified:</span>' + lastModified + <br> '<span class="headingFieldLabel">Resolved:</span>' + resolvedDate + '</div>';<br><br> // Add div to heading<br> $('div.panel-heading').first().append(datesDiv);<br> });<br><br> return;<br>});custom.css/* WI dates in heading */<br>div.headingFields{ <br> float: right;<br> font-size: 14px;<br>}<br><br>span.headingFieldLabel{<br> font-weight: bold;<br> padding-left: 10px;<br> padding-right: 5px;<br>}For other classes, replace
'Incident' on line 1 in custom.js with e.g. 'ServiceRequest' and change the 2 x 'viewModel.ResolvedDate' with 'viewModel.CompletedDate' on line 8.The original feature requests includes adding information about Created By, Last Modified By and Resolved By, but even though I can find CreatedBy quite easily, the two other properties are not set on the IR object itself (I can't find them at least), so it would require fetching the object through the API. I feel like this approach would be to heavy simply to display that information, so I have not included any of the "by" fields. If anyone is interested in those fields, please say so, and maybe we can have a look at it anyways.
4
Comments
That's good to hear, I'm happy to help!
Created By is helpful to see when an analyst created a WI on behalf of another user.
with
this should add "by *name*" after the created date
NB *name* being the name of the person who created the item
I tried to implement this over the weekend with Created By option and IR created via email wouldn't load when trying to open the WI. Any ideas how to fix that?
We've been using this without issues, and do show the CreatedBy without any issues, including on Incidents created via the Exchange Connector.
NOTE: The mailbox our exchange connector uses is associated with a generic user account, and it is this generic AD account that it puts in the CreatedBy, The generic AD Account also has the email address put into the e-mail field in the AD aaccount. If it is not setup this way then i'm not sure it can associate the created by user correctly
Here is the Incident Code we are using
app.custom.formTasks.add('Incident', null, function (formObj, viewModel) {<br> formObj.boundReady(function () {<br> // Convert dates to locale if they are not empty<br> var createdDate = viewModel.CreatedDate ? '<span class="headingFieldLabel">Created:</span>' + (new Date(viewModel.CreatedDate)).toLocaleString() : ' ';<br> var createdBy = viewModel.CreatedWorkItem ? ' (By: ' + viewModel.CreatedWorkItem.DisplayName + ')' : ' ';<br> var lastModified = viewModel.LastModified ? '<span class="headingFieldLabel">Last Modified:</span>' + (new Date(viewModel.LastModified)).toLocaleString() : ' ';<br> var resolvedDate = viewModel.ResolvedDate ? '<span class="headingFieldLabel">Resolved:</span>' + (new Date(viewModel.ResolvedDate)).toLocaleString() : ' ';<br><br> var datesDiv = createdDate + createdBy + lastModified + resolvedDate;<br> var headingDiv = '<div class="headingFields">' + datesDiv + '</div>';<br> $('div.panel-heading').first().append(headingDiv);<br> });<br> return;<br>});<br><br>and the CSS we are using as well (just in case/* WI dates in heading */<br>div.headingFields{ <br> float: right;<br> font-size: 14px;<br>}<br><br>span.headingFieldLabel{<br> font-weight: bold;<br> padding-left: 10px;<br> padding-right: 5px;<br>}<br><br>I wanted to share a quick modification I made, to let it support whichever date/time localization the user selects:
<span><br>// Convert dates to locale if they are not empty</span>I finally got tired of looking at this on my phone, so here's a small update to make this display properly on small screens as well:
Replace
$('div.panel-heading').first().append(datesDiv);with
app.isMobile() ? $('div.panel-heading').first().after(datesDiv) : $('div.panel-heading').first().append(datesDiv);Before:
After:
And also - nice addition @Tom_Hendricks, I've added that to my code as well, thanks!
Is it just me or is the code no longer visable?
I can only see the first line
app.custom.formTasks.add('Incident', null, function (formObj, viewModel) {@Magnus_Lundgren1 Yeah, I also only see the first line, thanks for pointing it out.
I've attached the code to this post, for anyone still interested.
I cannot get the above code to work.
Hey @John_Beasley
What isn't working? Are you getting any errors in the console? Have you made sure to clear your browser cache?
I'm having the same problem. The dates just do not show up. Tried different browsers and cleared the cache. Using portal version 9.4.1.2016. Added the code to the end of my custom.js and I can see the code in Chrome developer tools when I inspect the page so it isn't a cache issue. Tried in IE as well. End result is the page just displays the normal template.
Ah I see, I've messed up; I forgot the binding to the form ready event. I've attached a proper version here, the upload in my previous post is nuked. Let me know, if you have any issues with it.