Open a page from a request handler

Level: beginner

Open a Freedom UI page from a custom request handler

@creatio-devkit/common includes the HttpClientService service that opens pages. Both Freedom UI and Classic UI open record pages in a similar way. When Creatio adds a record, you can pass the needed default field values.

Detailed example: Open a Freedom UI page from a custom request handler.

To open a Freedom UI page from a custom request handler:

1. Add a button to open a Freedom UI page if needed. Instructions: Set up Button components (user documentation).

2. Add the dependencies. Instructions: Display the value of a system variable (similarly to step 2). Instead of the SysValuesService service, use the HttpClientService service that sends HTTP requests.

3. Set up how to handle the action executed on button click. Instructions: Optimize the execution of a custom business logic (step 4).

4. Implement the custom request handler.

   1. Go to the handlers schema section.

   2. Implement the usr.SomeCustomRequest custom request handler.

      1. Retrieve the instance of the HTTP client from @creatio-devkit/common.
      2. Send the crt.OpenPageRequest base request handler that opens the page.

      View an example of a usr.SomeCustomRequest request handler that sends the crt.OpenPageRequest request handler below. The crt.OpenPageRequest request handler opens the Some page page of the SomePageSchema schema.

      handlers schema section

      handlers: /**SCHEMA_HANDLERS*/[
          {
              request: "usr.SomeCustomRequest",
              /* The implementation of the custom request handler. */
              handler: async (request, next) => {
                  /* Retrieve the instance of the HTTP client from "@creatio-devkit/common." */
                  const handlerChain = sdk.HandlerChainService.instance;
                  /* Send the base request handler to open the "Some page" page of the "SomePageSchema" schema. */
                  await handlerChain.process({
                      type: 'crt.OpenPageRequest',
                      schemaName: 'SomePageSchema',
                      $context: request.$context,
                      scopes: [...request.scopes]
                  });
                  /* Call the next handler if it exists and return its result. */
                  return next?.handle(request);
              }
          }
      ] /**SCHEMA_HANDLERS*/,

Open a specific typified Freedom UI page from a base request handler

If you use different typified pages for a single section, the button that adds records displays as many options as the number of typified pages you set up. Creatio lets you set up the button to create records of a specific type only. In this case, the button displays no options and interacts with only one typified page.

Detailed example: Create records of a specific type using typified Freedom UI page.

To create records of a specific type only using a typified Freedom UI page:

1. Set up typified app pages for adding records if needed. Instructions: Set up typified app pages (user documentation).

2. Add a button that adds a new record using typified Freedom UI pages to the list page if needed. Instructions: Set up Button components (user documentation).

3. Select the page field that determines the record type you can create.

   1. Select the button added on the previous step on the working area of the Freedom UI Designer. This opens the element setup menu.
   2. Click . This opens the element setup area.
   3. Go to the Actions block.
   4. Click the Add field button. This opens the Select field window.
   5. Select the checkbox for the field that determines the type of added records.
   6. Click Select.
   7. Save the changes.

4. Set up how to handle the action executed on button click.

   1. Go to the viewConfigDiff schema section → page element that adds a record.
   2. Bind the ID of the needed value in the corresponding lookup to the clicked button event.

   View an example that opens the new page of the "SomeEntity" entity below. Populate the "SomeField" field using the value that has the "SomeValueIDFromTheLookup" ID.

   viewConfigDiff schema section

   viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[
       /* Button that creates a new record. */
       {
           "operation": "merge",
           "name": "SomeButton",
           "values": {
               /* Send the base request handler to open the new page of the "SomeEntity" entity. Populate the "SomeField" field using the value that has the "SomeValueIDFromTheLookup" ID. */
               "clicked": {
                   "request": "crt.CreateRecordRequest",
                   "params": {
                       "entityName": "SomeEntity",
                       "defaultValues": [
                           {
                               "attributeName": "SomeField",
                               "value": "SomeValueIDFromTheLookup"
                           }
                       ]
                   }
               },
               ...,
           }
       },
   ]/**SCHEMA_VIEW_CONFIG_DIFF*/,

5. Lock the field on the page for adding records (optional). Lock the field if you need to forbid changing the field value. To do this, select the Read-only checkbox for the page field that includes the record type you can create.

Open a Classic UI page from a custom request handler

@creatio-devkit/common includes the HttpClientService service that opens pages. Both Freedom UI and Classic UI open record pages in a similar way. When Creatio adds a record, you can pass the needed default field values.

Detailed example: Open a Classic UI page from a custom request handler.

To open a Classic UI page from a custom request handler:

1. Add a button to open a Classic UI page if needed. Instructions: Set up Button components (user documentation).

2. Add the dependencies. Instructions: Display the value of a system variable (similarly to step 2). Instead of the SysValuesService service, use the HttpClientService service that sends HTTP requests.

3. Set up how to handle the action executed on button click. Instructions: Optimize the execution of a custom business logic (step 4).

4. Implement the custom request handler.

   1. Go to the handlers schema section.

   2. Implement the usr.SomeCustomRequest custom request handler.

      Open the existing page

      1. Retrieve the instance of the HTTP client from @creatio-devkit/common.
      2. Send the crt.UpdateRecordRequest base request handler that opens the page using the specified ID. View the ID of the page in the browser address bar.

      View an example of a usr.SomeCustomRequest request handler that sends the crt.UpdateRecordRequest request handler below. The crt.UpdateRecordRequest request handler opens the page of the SomeEntityCode entity using the Some-Record-Id ID.

      handlers schema section

      handlers: /**SCHEMA_HANDLERS*/[
          {
              request: "usr.SomeCustomRequest",
              /* The implementation of the custom request handler. */
              handler: async (request, next) => {
                  /* Retrieve the instance of the HTTP client from "@creatio-devkit/common." */
                  const handlerChain = sdk.HandlerChainService.instance;
                  /* Send the base request handler to open the page of the "SomeEntityCode" entity using the specified ID. */
                  await handlerChain.process({
                      type: 'crt.UpdateRecordRequest',
                      entityName: 'SomeSchemaName',
                      recordId: 'Some-Record-Id',
                      $context: request.$context
                  });
                  /* Call the next handler if it exists and return its result. */
                  return next?.handle(request);
              }
          }
      ] /**SCHEMA_HANDLERS*/,
      Create a new page and fill out the fields using the specified values

      1. Retrieve the instance of the HTTP client from @creatio-devkit/common.
      2. Send the crt.CreateRecordRequest base request handler that creates a page and populates the fields using the specified values.

      View an example of a usr.SomeCustomRequest request handler that sends the crt.CreateRecordRequest request handler below. The crt.CreateRecordRequest request handler creates the page of the SomeEntityCode entity and populates the SomeField field using the "Some value" value.

      handlers schema section

      handlers: /**SCHEMA_HANDLERS*/[
          {
              request: "usr.SomeCustomRequest",
              /* The implementation of the custom request handler. */
              handler: async (request, next) => {
                  /* Retrieve the instance of the HTTP client from "@creatio-devkit/common." */
                  const handlerChain = sdk.HandlerChainService.instance;
                  /* Send the base request handler to open the new page of the "SomeEntityCode" entity. Populate the "Some field" field using the "Some value" value. */
                  await handlerChain.process({
                      type: 'crt.CreateRecordRequest',
                      entityName: 'SomeEntityCode',
                          defaultValues: [{
                              attributeName: 'SomeField',
                              value: 'Some value'
                          }],
                          $context: request.$context
                  });
                  /* Call the next handler if it exists and return its result. */
                  return next?.handle(request);
              }
          }
      ] /**SCHEMA_HANDLERS*/,

---

See also

Set up Button components (user documentation)

Display the value of a system variable

Optimize the execution of a custom business logic

Set up typified app pages (user documentation)

Freedom UI page customization basics