---
sourceDocument: Criar ou modificar aplicações do Xanadu
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/xanadu/application-development

 Release :

    - xanadu

ft:locale :

    - pt-BR

ft:publication_title :

    - Criar ou modificar aplicações do Xanadu

ft:clusterId :

    - cadev

bundleId :

    - cadev

workflow :

    - Creator


---

# Adicionar formulários a páginas do Construtor de IU

# Adicionar formulários a páginas do Construtor de IU {#ariaid-title1}

* Versão de lançamento: Xanadu
* 
* Atualizado 1 de ago. de 2024
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 2 min. de leitura

Use o componente Formulário para adicionar um ou mais formulários a Construtor de IU páginas.  
Adicione funcionalidade às suas Construtor de IU páginas incluindo formulários. Você define os campos no formulário e suas propriedades, como torná-los obrigatórios. Em seguida, colete dados conforme o formulário é preenchido e enviado.Figura 1. Exemplo de componente de formulário  
Você pode adicionar mais de um formulário a uma única página. Você também pode adicionar um formulário a uma página que já contém um componente com um formulário aninhado. Exemplos de casos de uso incluem:

* Estenda as páginas de registro adicionando uma guia em linha com um formulário usando sua própria instância do controlador de formulário.
* Adicione modais com um formulário em uma página de registro.
{#add-forms-to-ui-builder-pages__ul_fm4_ykt_wbc}  
Para páginas existentes com formulários criados em uma versão pré-Xanadu ServiceNow, você deve aplicar uma predefinição ao formulário original antes de adicionar outro formulário à página. A aplicação da predefinição é um pré-requisito para adicionar vários formulários a uma página e permite que vários formulários funcionem conforme o esperado em uma página. A predefinição do controlador de formulário deve ser aplicada a todos os controladores de formulário.

1. Abra a página que contém um formulário existente.
2. Na gaveta de dados, expanda a lista Recursos de dados e selecione o controlador de formulário original.

3. Selecione o campo Predefinição.
4. Selecione Predefinição do controlador de formulário.

5. Selecione Aplicar.
6. Selecione o X para fechar o pop-up Editar controlador de formulário.

   Exatamente um dos controladores de formulário deve ter a propriedade Está mapeado para o shell da aplicação definida como verdadeira. Esta propriedade é usada para especificar o formulário primário na página. O formulário primário é responsável por lidar com eventos globais. Você não deve definir a propriedade como verdadeira para mais de um controlador de formulário ou ter controladores de formulário zero com a propriedade definida como verdadeira.
7. Abra a página que contém um ou mais formulários.
8. Na árvore de conteúdo, selecione um formulário.

9. No painel de configuração, na guia Configurar, selecione Controlador de formulário.

10. No pop-up Editar controlador de formulário, role para baixo na lista Controlador de formulário para encontrar a opção Está mapeado para o App Shell.

11. Marque ou desmarque a opção para cada componente de formulário na página para confirmar que exatamente um controlador de formulário está mapeado para o shell da aplicação.
{#add-forms-to-ui-builder-pages__ol_olf_mjt_wbc}

## Manipulação avançada de eventos de formulário {#add-forms-to-ui-builder-pages__section_c5d_3tr_1cc}

Os detalhes a seguir podem ser úteis para desenvolvedores experientes com conhecimento de manipulação de eventos de conflito.  
Se isMapped to app shell estiver definido como verdadeiro, o formulário lidará com estes eventos automaticamente:

Status da tela alterado
:
    * Descrição: ação para indicar que um formulário está modificado.
    * Saída: `CTRL_RECORD#SCREEN_STATUS_CHANGED`
    {#add-forms-to-ui-builder-pages__ul_htx_ztr_1cc}

Atualizar menu de configuração solicitado
:
    * Descrição: ação para definir itens do menu de configuração de registro no menu do avatar.
    * Saída: `CTRL_RECORD#UPDATE_CONFIGURATION_MENU_REQUEST`
    {#add-forms-to-ui-builder-pages__ul_dzs_j5r_1cc}

Telefone solicitado
:
    * Descrição: ação para fazer uma chamada quando o plug-in CTI está habilitado.
    * Saída: `CTRL_RECORD#PHONE_REQUESTED`
    {#add-forms-to-ui-builder-pages__ul_ngj_k5r_1cc}

Estado de carregamento do formulário alterado
:
    * Descrição: ação para mostrar um carregamento giratório quando esse formulário estiver carregando dados.
    * Saída: `CTRL_RECORD#FORM_LOADING_STATE_CHANGED`
    {#add-forms-to-ui-builder-pages__ul_nmq_k5r_1cc}

Para obter informações detalhadas sobre o componente Formulário e suas propriedades, consulte [Visão geral do formulário](https://developer.servicenow.com/dev.do#!/reference/next-experience/washingtondc/now-components/form%20record%20page/overview) no site do desenvolvedor ServiceNow.