Prompting for a short description for the cart and resulting request

jamesmcwhinney
Giga Guru

Background:

One of our main use cases for the service catalog is to request access, hardware and software for new hires.

To accommodate this, we have created individual catalog items for access to each of our IT systems, and for the various hardare and software our users might require.

We then created an order guide that will allow managers to answer a series of questions, and then automatically fill their shoping cart with the required items from the catalog.

On checkout, the cart is converted to a request, and the "requested for" field is set automatically based on what was specified in the cart.


When it comes to managing those requests, out of the box the ESS portal is setup such that when users want to check the status of their requests, they are directed to the requested items rather than the request.

We have decided to manage by the request since that is where most of our approvals will be (to reduce redundant approvals) and since managers will generally want to quickly be able to see that status of the new hire setup as a whole rather then by opening up each individual item.

Having the "requested for" field on the request records is helpful, but we would also like to be able to give the requests a title.

Adding "Request Description" to the cart checkout page

After some digging, it looks like the logic that controls the conversion of cart to sc_request is handled in the script include "CatalogTransactionCheckout":

Script Include "CatalogTransactionCheckout"
_checkout : function(catalog, catalogView) {
var view = this.request.getParameter("sysparm_view");
if (!view)
view = "ess";
var req = new GlideappRequestNew();
var requestRecord = req.copyCart();
var cart = new GlideappCart();
cart.empty();
return this._checkoutRedirect(view, catalog, catalogView, requestRecord);
},


However, to prevent potential issues with future upgrades, I have opted to avoid changing this script.

Instead, I have used user preferences to temporarily store the cart name, and then update the request record immediately after it is generated.

Note that the below is based on Fuji...

Since we are using the two stage checkout, I have opened up Service Catalog -> Cart Definitions -> Maintain Cart Layouts and then opened "Cart Preview Screen (Two Step)".

From there I added a new widget macro "sc_cart_view_custom" as shown below.

This will provide a field to enter the description into , and update a new user preference called "user_cart_name" in real time via client scripting.

Widget Macro "sc_cart_view_custom"

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<div class="sc_requested_for_container">

  <table class="sc_requested_for" cellspacing="0" cellpadding="3">

    <tr class="header">

      <td width="30%">

        ${gs.getMessage('Short description of request')}:

      </td>

    </tr>

    <tr>

      <td valign="top">

        <input type="text" name="user_cart_name" id="user_cart_name" onChange="setPreference('user_cart_name', this.value);" value="" size="50"/>

<script>

document.getElementById("user_cart_name").value = getPreference('user_cart_name');

</script>  

      </td>

    </tr>

  </table>

</div>

</j:jelly>

To apply the cart name to the resulting request record just after it is created, I have updated the cart layout "Order Status Screen" since that is what the user is directed to immediately after checking out.

I have created a new widget macro "sc_cart_view_custom2" as shown below to take the cart name stored in the users preferences and apply it to the newly generated request record.

sc_cart_view_custom2

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<g:evaluate jelly="true">

  var therequest = null;

  var gr = new GlideRecord('sc_request');

  gr.query("sys_id",jelly.sysparm_sys_id);

  if (gr.next()) {

    var usercartname = gs.getUser().getPreference("user_cart_name");

    if((jelly.jvar_new_request)&amp;&amp;(usercartname != '')&amp;&amp;(gr.short_description== '')){

      gr.short_description = usercartname

      gr.update();

      gs.getUser().setPreference("user_cart_name","");

    }

    therequest = gr;

  }

</g:evaluate>

<g:evaluate jelly="true" var="jvar_requestedfor_displayname" object="false">

  var RequestedForUserSysID = therequest.requested_for;

  var myUserObject = gs.getUser();

  myUserObject = myUserObject. ­getUserByID(RequestedForUserSysID);

  myUserObject.getDisplayName();

</g:evaluate>

<g:evaluate jelly="true" var="jvar_request_short_desc" object="false">

  therequest.short_description;

</g:evaluate>

<div id="sc_order_status_intro_text" class="order_summary">

  <j:if test="${jvar_sc_request_number == 'true'}">

    <div style="font-weight:normal; margin: 0px 0px 6px 0px; padding:0px;">

      ${gs.getMessage('Requested For')}:$[SP]

      <b>${jvar_requestedfor_displayname}</b>

    </div>

    <div style="font-weight:normal; margin: 0px 0px 6px 0px; padding:0px;">

      ${gs.getMessage('Short Description')}:$[SP]

      <b>${jvar_request_short_desc}</b>

    </div>

  </j:if>

</div>

</j:jelly>

The result is below:

SNcartDescription.jpg

SNcartDescription2.jpg

1 REPLY 1

jamesmcwhinney
Giga Guru

Either Fuji patch 8 changed something or I didn't test thoroughly enough because I have noticed that when a user opens an existing order they are not taken to the above "Order Status" page.


Instead, they are taken to UI page "com.glideapp.servicecatalog_checkout_view" which means they will not see the request description or the requested for user.



To fix this, I made the below adjustments to said UI page:



............


.................


<div class="sc_checkout_page">


 


      <j2:set var="jvar_never_show_price" value="$[gs.getProperty('glide.sc.price.display') == 'never']" />


 


      <g2:evaluate jelly="true" var="jvar_request" expression="


 


              sc_request = new GlideRecordSecure('sc_request');


 


              var sys_id = SNC.GlideHTMLSanitizer.sanitize(jelly.sysparm_sys_id);


 


              if (sys_id == null || sys_id == 'undefined' || sys_id == '')


 


                      sys_id = '${sys_id}';


 


              sc_request.get(sys_id);" />


 


                                             


 


                                              <g2:evaluate jelly="true">


 


var RequestedForUserSysID = sc_request.requested_for;


 


                                                                                              var myUserObject = gs.getUser();


 


                                                                                              myUserObject = myUserObject. ­getUserByID(RequestedForUserSysID);


 


                                                                                              var requested_for = myUserObject.getDisplayName();


 


                                              </g2:evaluate>


 


                                             


 


      <g2:evaluate var="jvar_request_item" expression="sc_req_item = new GlideRecordSecure('sc_req_item'); sc_req_item.addQuery('request', sys_id); sc_req_item.query();" />


 


      <g2:evaluate jelly="true">


 


              var permalink = GlideappCatalogURLGenerator.getCheckoutURL(sys_id, jelly.sysparm_catalog, jelly.sysparm_catalog_view);


 


              permalink = GlideappCatalogURLGenerator.escapeForNavTo(permalink);


 


      </g2:evaluate>


 


      <j2:choose>


 


      <j2:when test="$[jvar_request]">


 


      <div class="order_summary">


 


              <!-- Confirmation message where appropriate -->


 


              <j2:if test="$[sysparm_new_request == 'true']">


 


                      <div class="outputmsg outputmsg_success" style="margin-bottom:12px;">


 


                              <img class="outputmsg_image" src="images/outputmsg_success_24.gifx" title="${gs.getMessage('Thank you, your request has been submitted')}" />


 


                              <div class="outputmsg_text" style="color:#009700; font-weight:bold;">


 


                                      ${gs.getMessage('Thank you, your request has been submitted')}


 


                              </div>


 


</div>


 


</j2:if>


 


              <div style="font-size: 5px">$[SP]</div>


 


              <!-- Time stamp and Request Summary -->


 


              <g2:evaluate var="jvar_open_time" expression="sc_request.getDisplayValue('opened_at')" />


 


                      <div style="font-weight:normal; margin:0px 0px 6px 0px; padding:0px;">


 


<span>${gs.getMessage('Order Placed')}:$[SP]</span>


 


<b>$[jvar_open_time]</b>


 


                              $[SP]$[SP]


 


                      </div>


 


                      <div style="font-weight:normal; margin:0px 0px 6px 0px; padding:0px;">


 


                              ${gs.getMessage('Request Number')}:$[SP]


 


<b>$[sc_request.number]</b>


 


                              $[SP]$[SP]


 


                              <a class="linked" id="permalink" target="_top" style="color:#003366;" title="${gs.getMessage('bookmark_link_help_note')}" href="nav_to.do?uri=$[permalink]">


 


                                      ${gs.getMessage('Bookmark request')}


 


                              </a>


 


                      </div>


 


                                                                                                                                              <div style="font-weight:normal; margin:0px 0px 6px 0px; padding:0px;">


 


                              ${gs.getMessage('Requested for')}:$[SP]


 


<b>$[requested_for]</b>


 


                      </div>


 


                                                                                                                                              <div style="font-weight:normal; margin:0px 0px 6px 0px; padding:0px;">


 


                              ${gs.getMessage('Short Description')}:$[SP]


 


<b>$[sc_request.short_description]</b>


 


                      </div>


 


                      <div style="font-weight:normal; margin:0px 0px 6px 0px; padding:0px;">


 


                              ${gs.getMessage('catalog_estimated_complete')}$[SP]


 


                              <strong>


 


                                      <span id="delivery_date" />


 


                              </strong>


 


                      </div>


 


      </div>


  .....................


...........