Denne side dokumenterer nogle af de JavaScript-komponenter i Confluence, som du kan bruge i dit plugin.

Autokomplettering af inputfelter

Confluence indeholder en række komponenter til autokomplettering af input til forskellige indholdstyper. Du skal blot bruge den rigtige klasse på inputfeltet. Du kan også konfigurere autokomplettering med nogle “data-“-attributter (se eksempler i tabellen senere på denne side). hændelser affyres på inputelementet via jQuery-hændelsessystemet, så klienterne kan lytte efter de dokumenterede hændelser.

Attributnavn

Beskrivelse

data-skabelon

En skabelon, der bruges til at udfylde værdien for input.

data-none-message

En meddelelse, der vises, når der ikke er returneret nogen resultater.

data-max

Maksimalt antal søgeresultater, standardværdi er 10, hvis den ikke er defineret.

data-alignment

Afpasning af rullelisten til automatisk udfyldning i forhold til indtastningsfeltet. Standardindstillingen er “venstre”.

data-dropdown-target

En målelementvælger til at placere den autokomplette drop-down i.

  • Hvis der ikke er angivet nogen, placeres den i en div umiddelbart efter indtastningsfeltet.

data-target

En targetelementvælger til at opdatere sin værdi med den værdi, der leveres af data-template.

  • Dette er typisk nyttigt, når du ønsker at vise brugerens fulde navn i inputfeltet, men sende brugernavnet til serveren, så et andet inputelement skal opdateres.

Events thrown:

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

Space autocomplete 

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

Attachment autocomplete 

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

Page autocomplete 

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

Blogindlæg autokomplettering 

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

Side og blogindlæg autokomplettering 

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

Alt indhold autokomplettering

Det omfatter sider, blogs, rum, brugere og vedhæftede filer.

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

Brugerautokomplettering

Denne komponent kaster brugerspecifikke hændelser:

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

Bruger hover

For at vise flere oplysninger om brugeren, når brugeren holder musen hen over brugerlinket, kan du tilføje klassen confluence-userlink og en data-attribut på data-username til dit linktag.

Hændelser, der kastes:

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