Auto-Expand Item Details


Wade Guidry, University of Washington


This customization auto-expands items to make visible to the user all configured display fields.

The issue this customization addresses is users not knowing, or knowing how to, expand items to view additional info that may be useful to them.

Primo VE item record view, collapsed by default.
Before: Item details collapsed by default
Primo VE item record expanded
After: Item details expanded on load

System Components

Alma Discovery (VE), Customization Package

Skillset Requirements

Alma Discovery Customization Package, JavaScript


Not tested.

Browser Support

Tested on Chrome, Firefox, and Safari.

Mobile Support

Not tested.

Implementation Steps


  • Add ‘expand-items’ to your app variable in custom.js
  • Add the ‘expand-items’ module to your custom.js file
  • Save and deploy


  1. In your local package, in the custom.js file, include the module ‘expand-items’ in your app definition. For example:

    var app = angular.module('viewCustom', ['expand-items']);
  2. Also in the custom.js file, within the anonymous function, insert the code below:

    /* ====== Expand physical items in full display by default ===== */
    .module('expand-items', [])
    .component('prmLocationItemAfter', {
    bindings: { parentCtrl: '<' },
    controller: function ($timeout) {
    var ctrl = this;
    this.$onInit = function () {
    $timeout(showDetails, 2000);
    function showDetails() {
    ctrl.parentCtrl.loc.isExpandAll = true;
    ctrl.parentCtrl.currLoc.items.forEach((item) => {
    item.isExpanded = true;
    /* ====== end expand-items ====== */

  3. Zip and upload your package in Alma Discovery. Save your view.