Product documentation Docs
    • English
    • Deutsch
    • 日本語
    • 한국어
    • Français
  • More Sites
    • Now Community
    • Developer Site
    • Knowledge Base
    • Product Information
    • ServiceNow.com
    • Training
    • Customer Success Center
    • ServiceNow Support Videos
  • Log in

Product documentation

  • Home
How search works:
  • Punctuation and capital letters are ignored
  • Special characters like underscores (_) are removed
  • Known synonyms are applied
  • The most relevant topics (based on weighting and matching to search terms) are listed first in search results
Topics are ranked in search results by how closely they match your search terms
  • A match on the entire phrase you typed
  • A match on part of the phrase you typed
  • A match on ALL of the terms in the phrase you typed
  • A match on ANY of the terms in the phrase you typed

Note: Matches in titles are always highly ranked.

  • Release version
    Table of Contents
    • Now Platform capabilities
Table of Contents
Choose your release version
    Home Orlando Now Platform Capabilities Now Platform capabilities Agent Workspace Setting up workspace Set up Record View in workspace Set up custom UI actions in Workspace Render a Now component in a modal

    Render a Now component in a modal

    • Save as PDF Selected topic Topic & subtopics All topics in contents
    • Unsubscribe Log in to subscribe to topics and get notified when content changes.
    • Share this page

    Render a Now component in a modal

    Use a UI Action to launch a custom Now component in a modal so an agent doesn't have to navigate to a different screen to accomplish a task.

    Before you begin

    Role required: workspace_admin

    About this task

    Launch a custom component in a modal so an agent doesn't have to leave the current screen. For example, you can launch a modal that contains contact information about the customer named in an open record so an agent can ask callers to confirm their identity. The following example shows a list in a modal.

    List in modal

    Procedure

    1. Develop and deploy a custom component to your instance. For more information, see Developing components for Workspace.
    2. Create an entry in the Registered Scripting Modal.
      1. In the Filter Navigator, enter sys_aw_registered_scripting_modal.list to open that table.
      2. Click New.
      3. Use the search icon (search icon) to select a component, in this case, use sn-workspace-header.
      4. Enter the name of the API, in this case showHeader.
      5. Public API gets auto-populated:
        Register modal
      6. Click Save.
    3. Author your UI Action to render your component in a modal.
      1. Create a new UI Action for the appropriate table and on the Workspace tab, select either Workspace Form Button or Workspace Menu Button depending on how and where you want the UI Action to appear. For information on creating a UI Action, see Set up UI Actions in Workspace.

        Workspace form button or menu

        When you select one of the check boxes, the Workspace Client Script text box appears.
      2. Enter the following code in the Workspace Client Script text box:
        function onClick(g_form) {
          g_modal.global.showHeader({
            title: 'Test custom modal',
            confirmTitle:'YES',
            params: {
              primaryValue: 'THIS IS A PRIMARY VALUE',
              secondaryItems:{}
            }
          }).then(function(result){
            alert('confirm:'+result);
          }, function(error) {
            alert('cancel:'+error);
          });
        }
    4. Now test the UI Action by opening a record in Workspace from the table you selected when creating this UI Action. The UI Action should appear in the Form pane.

    Tags:

    Feedback
    On this page

    Previous topic

    Next topic

    • Contact Us
    • Careers
    • Terms of Use
    • Privacy Statement
    • Sitemap
    • © ServiceNow. All rights reserved.

    Release version
    Choose your release version

      Render a Now component in a modal

      • Save as PDF Selected topic Topic & subtopics All topics in contents
      • Unsubscribe Log in to subscribe to topics and get notified when content changes.
      • Share this page

      Render a Now component in a modal

      Use a UI Action to launch a custom Now component in a modal so an agent doesn't have to navigate to a different screen to accomplish a task.

      Before you begin

      Role required: workspace_admin

      About this task

      Launch a custom component in a modal so an agent doesn't have to leave the current screen. For example, you can launch a modal that contains contact information about the customer named in an open record so an agent can ask callers to confirm their identity. The following example shows a list in a modal.

      List in modal

      Procedure

      1. Develop and deploy a custom component to your instance. For more information, see Developing components for Workspace.
      2. Create an entry in the Registered Scripting Modal.
        1. In the Filter Navigator, enter sys_aw_registered_scripting_modal.list to open that table.
        2. Click New.
        3. Use the search icon (search icon) to select a component, in this case, use sn-workspace-header.
        4. Enter the name of the API, in this case showHeader.
        5. Public API gets auto-populated:
          Register modal
        6. Click Save.
      3. Author your UI Action to render your component in a modal.
        1. Create a new UI Action for the appropriate table and on the Workspace tab, select either Workspace Form Button or Workspace Menu Button depending on how and where you want the UI Action to appear. For information on creating a UI Action, see Set up UI Actions in Workspace.

          Workspace form button or menu

          When you select one of the check boxes, the Workspace Client Script text box appears.
        2. Enter the following code in the Workspace Client Script text box:
          function onClick(g_form) {
            g_modal.global.showHeader({
              title: 'Test custom modal',
              confirmTitle:'YES',
              params: {
                primaryValue: 'THIS IS A PRIMARY VALUE',
                secondaryItems:{}
              }
            }).then(function(result){
              alert('confirm:'+result);
            }, function(error) {
              alert('cancel:'+error);
            });
          }
      4. Now test the UI Action by opening a record in Workspace from the table you selected when creating this UI Action. The UI Action should appear in the Form pane.

      Tags:

      Feedback

          Share this page

          Got it! Feel free to add a comment
          To share your product suggestions, visit the Idea Portal.
          Please let us know how to improve this content

          Check any that apply

          To share your product suggestions, visit the Idea Portal.
          Confirm

          We were unable to find "Coaching" in Jakarta. Would you like to search instead?

          No Yes
          • Contact Us
          • Careers
          • Terms of Use
          • Privacy Statement
          • Sitemap
          • © ServiceNow. All rights reserved.

          Subscribe Subscribed Unsubscribe Last updated: Tags: January February March April May June July August September October November December No Results Found Versions Search preferences successfully updated My release version successfully updated My release version successfully deleted An error has occurred. Please try again later. You have been unsubscribed from all topics. You are now subscribed to and will receive notifications if any changes are made to this page. You have been unsubscribed from this content Thank you for your feedback. Form temporarily unavailable. Please try again or contact  docfeedback@servicenow.com  to submit your comments. The topic you requested does not exist in the release. You were redirected to a related topic instead. The available release versions for this topic are listed There is no specific version for this documentation. Explore products Click to go to the page. Release notes and upgrades Click to open the dropdown menu. Delete Remove No selected version Reset This field is required You are already subscribed to this topic Attach screenshot The file you uploaded exceeds the allowed file size of 20MB. Please try again with a smaller file. Please complete the reCAPTCHA step to attach a screenshot
          Log in to personalize your search results and subscribe to topics
          No, thanks Login