Service Portal To-Do Menu Item Scripted List

yundlu316
Kilo Guru

‎11-15-2019 10:32 AM

Our team is looking to develop a Header Menu Item that's similar to the Approvals menu item in the SP Header Menu seen on /sp:

find_real_file.png

Instead of Approvals, we'd like to do the same exact thing for To-Dos.  We've copied over the Scripted List for Approvals as reference and are using the ootb todoPageUtils script include, however we can't get the list to generate.  The count is showing up and appears correct, but our list is showing zero records.  Our code is definitely wrong, but not sure how to correct it.

var myTodosCountObject = new sn_hr_sp.todoPageUtils().getMyTodosCount();
data.todoCount = myTodosCountObject.todoCount;
data.todoList = new sn_hr_sp.todoPageUtils().getTodoConfigDisplayValue;
data.recordWatchers = myTodosCountObject.recordWatchers;

var t = data;
t.items = [];
t.count = myTodosCountObject.todoCount;

var x = new sn_hr_sp.todoPageUtils().getTodoConfigDislayValue;
for(var i = 0; i<x.length; i++){
  t.items.push(x);
}

t.record_watchers = myTodosCountObject.recordWatchers;
Preview file
68 KB
Preview file
68 KB
  • 4,037 Views
1 REPLY 1

Oleg
Mega Sage

‎11-15-2019 02:52 PM

You didn't included any test data, but I guess, that the items of data.items (t.items in your code) don't contains required properties.

First of all, I'd recommend you to create test menu item of the type "Scripted List" and the following dummy code:

(function (data) {

  data.items = [
    {
      type: "record",
      __table: "my_custom_table",
      sys_updated_on: "2019-09-12 06:00:26",
      sys_id: "25db8156dbbfbf0095a810825b961924",
      short_description: "My first item",
      number: "ABC0010001"
    },
    {
      type: "record",
      __table: "my_custom_table",
      sys_updated_on: "2019-09-12 06:00:26",
      sys_id: "35db8156dbbfbf0095a810825b961924",
      short_description: "My second item",
      number: "ABC0010001"
    }
  ];
  data.count = data.items.length;
  data.record_watchers = [
    { filter: "active=true", table: "my_custom_table" }
  ];
  
})(data);

 You will see that two dummy menu items appears and look like on the picture below:

find_real_file.png

You can see that I used `type: "record"` property in the items, because default "spDropdownTreeTemplate" ng-template, used by "Header Menu" widget, contains the following fragment:

<a ng-if="mi.type == 'record' && !mi.__page"
   aria-label="${Open} {{::mi.number}} : {{::mi.short_description}}"
   aria-describedby="id_{{::mi.number}}"
   ng-href="?id=ticket&table={{::mi.__table}}&sys_id={{::mi.sys_id}}"
   ng-click="collapse()" role="menuitem">
  <span>{{::mi.short_description | characters:60}}</span>
  <span class="block color-primary text-muted">
    <span class="block" style="float: right" id="id_{{::mi.number}}">
      <sn-time-ago timestamp="::mi.sys_updated_on" />
    </span>
    {{mi.number}}
  </span>
</a>

I suggest you to verify that the items of data.items (t.items in your code) contains type property with the value "record" and properties __table, sys_updated_on, sys_id, short_description and number.

Alternatively you can modify ng-template spDropdownTreeTemplate" and include additional code fragment, which build menu items close to the items above based on data.items, which you fill.

 

Preview file
28 KB