Publication Year Range in Advanced Search


  • Hui Zhang, Oregon State University
  • Documentation by Carlos Torres, Seattle University


Adds a dropdown for “Publication Year Range” that presets the Start/End date range in advanced search.

Select element labeled Publication Year Range with the default option Any years selected.
Three options in the select dropdown: Any years, Last year, and Last two years.

System Components

Alma Discovery (VE), Customization Package

Skill Set Requirements

Alma Discovery, JS


Web Accessibility Checklist for Primo VE Customizations

Browser Support

Chrome, Firefox

Mobile Support




  • Declare the directive and options in your custom.js file
  • Optionally customize the display of the dropdown with CSS
  • Zip package and load to view via Alma Discovery


  1. Turn on inheritance from the Central Package.
  2. In your local package, in the custom.js file, include the module ‘addPubyearAdvsearch’ in your app definition. For example:

    var app = angular.module('viewCustom', ['addPubyearAdvsearch']);
  3. Also in the custom.js file, insert the code below:

    app.component('prmAdvancedSearchAfter', {
    template: '<add-pubyear-advsearch></add-pubyear-advsearch>'

  4. To customize the date range options, add the code below to your custom.js file and modify for your needs. The label above the dropdown is in “formName.” Each option in the dropdown is an object in the “pubyears” property between curly brackets ({}) with the label in “numyear” and the number of years to subtract from this year in “yeardiff.”

    Note that the first object is the default option to reset the date fields. The label “Any years” can be changed, but the “yeardiff” must remain 0.

    app.value('addPubyearAdvsearchOptions', {
    formName: 'Publication Year Range',
    pubyears: [
    "numyear": "Any years",
    "yeardiff": 0
    "numyear": "Last year",
    "yeardiff": -1
    "numyear": "Last two years",
    "yeardiff": -2

  5. By default, the dropdown will display below the advanced search box. You can optionally edit your custom1.css file to move it elsewhere. The rulesets below will hide the default start and end date dropdowns and move the new publication year range dropdown up into their place.

    prm-advanced-search .date-range-inputs {
      display: none;

    add-pubyear-advsearch {
      position: absolute;
      right: 1px;
      bottom: 111px;

    add-pubyear-advsearch #pubyear-dropdown {
      width: 18em;

    add-pubyear-advsearch .layout-column {
      width: 100%;

    @media only screen and (max-width: 600px) {
      #advancedSearchTabs {
        margin-bottom: 90px;

      add-pubyear-advsearch {
        left: 0;

      add-pubyear-advsearch #pubyear-dropdown {
        width: 100%;

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