Custom Search Within A Page

Forums General discussion Custom Search Within A Page

Viewing 1 reply thread
  • Author
    Posts
    • #34848
      SteveE
      Participant

      Here’s some code that creates a custom search in classic web part or wiki page. It will search all web parts only on the current page but regardless if the web parts are batched to show only so many at a time.

      Use case: A custom list where I want users to only be able to view or search for entries where their name is in a field, but there are multiple people pickers it could apply to.

      Initial setup:

      • Set up custom list with permission to edit all items
      • Turn off “Allow items from the list to appear in search results”
      • Create a view that filters to only return items if their name is in a people picker. Example: Manager (field) is equal to [Me]
      • Add a CEWP or Modern CEWP to the page

      Add this code to the HTML section of the CEWP:

      
      
      <style unselectable=”on”>
      /* hide default search bar */
      #DeltaPlaceHolderSearchArea 
      {display: none;}
      </style>
      
      Manager:&nbsp;&nbsp;
      
      <script type="text/javascript">
      function RedirectUrl()
      {
      var mgr = document.getElementById("MgrSearch").value;
      if(mgr != null)
      {
      window.location.href="?FilterName=Manager&FilterMultiValue=*"+mgr+"*";
      /* Change Manager to your FIN */
      }
      return false;
      }
      </script>
      <input type="text" style="width: 100px" id="MgrSearch" onkeydown="if (event.keyCode == 13) {return RedirectUrl();; return false;}"/>
      <input type="button" style="min-width: 45px; padding: 3px; margin: 1 0 0px" id="MgrSearch" value="Search" onclick="return RedirectUrl();" />
      • This topic was modified 1 month, 2 weeks ago by SteveE.
    • #34897
      Alexander Bautz
      Keymaster

      Thanks for sharing this tip!

      Alexander

Viewing 1 reply thread
  • You must be logged in to reply to this topic.