Esta página documenta alguns dos componentes JavaScript Confluence que você pode usar em seu plugin.

Campos de entrada autocompletos

Confluence fornece um número de componentes de entrada autocompletos para vários tipos de conteúdo. Você simplesmente precisa da classe certa no campo de entrada. Você também pode configurar o autocompletar com alguns atributos de ‘dados’ (veja exemplos na tabela mais adiante nesta página). Eventos são disparados no elemento de entrada via sistema de eventos jQuery, para que os clientes possam ouvir os eventos documentados.

Nome do atributo

Descrição

data-template

Um template usado para preencher o valor para o input.

data-none-message

Uma mensagem para mostrar quando nenhum resultado for retornado.

data-max

Número máximo de resultados de pesquisa, padrão para 10 se não definido.

alinhamento de dados

Alinhamento da queda do autocompletar em relação ao campo de entrada. Alinhamento padrão à “esquerda”.

data-dropdown-target

Um seletor de elemento alvo para colocar o drop-down autocompleto em.

  • Se nenhum especificado, ele será colocado em um div imediatamente após o campo de entrada.

data-target

Um seletor de elemento de destino para atualizar seu valor com o valor fornecido pelo modelo de dados.

  • Isso normalmente é útil quando você quer exibir o nome completo do usuário no campo de entrada, mas enviar o nome do usuário para o servidor, então outro elemento de entrada precisa ser atualizado.

Eventos lançados:

  • open.autocomplete-content
  • selected.autocomplete-content

Espaço autocompleto 

1
<input class="autocomplete-space" data-max="10" data-none-message="No results" data-template="{name}">

Aprendizagem autocompletar 

1
<input class="autocomplete-attachment" data-max="10" data-none-message="No results" data-template="{fileName}">

Página autocompletar 

1
<input class="autocomplete-page" data-max="10" data-none-message="No results" data-template="{title}">

>

Blog pós autocompletar

>

>

1
<input class="autocomplete-blogpost" data-max="10" data-none-message="No results" data-template="{title}">

>

Página e blog post autocompletar 

1
<input class="autocomplete-confluence-content" data-none-message="No results" data-template="{title}">

Todo o conteúdo autocompletar

Inclui páginas, blogs, espaços, usuários e anexos.

1
<input class="autocomplete-search" data-none-message="No results" data-template="{title}">

Autocompletar usuário

Este componente lança eventos específicos do usuário:

  • open.autocomplete-user
  • selected.autocomplete-user
1
<input class="autocomplete-user" data-none-message="No users found" data-template="{username}">

Passar o rato pelo utilizador

Para mostrar mais informação sobre o utilizador quando passar o rato pelo link do utilizador, você pode adicionar a classe confluence-userlink e um atributo de dados de data-username à sua tag de link.

Eventos lançados:

  • hover-user.open
  • hover-user.follow>
1
<a class="confluence-userlink" data-username="admin">A. D. Ministrator</a>