NOTESSIDAN

Allt om Lotus Notes & Domino




Dynamic Content med extLib i xPages - 3 enkla steg

Dynamic content är en kontroll som ingår i extLib, denna kontroll ger dig bland annat möjlighet att ändra en del av innehåller på en websida och samtidigt och låta användaren sätta ett bokmärke för att komma tillbaka till det innehåll som var valt.

Varje gång man kallar på kontrollen får url:en en ny hashtag, tex. "minxpage.xsp#content=news"

i exemplet nedan har jag gjort två paneler som ligger i en dynamicContent kontroll, i mina paneler kan jag lägga in vilket content jag vill eller hela custom controls.
vill jag använda mig av hashtaggen så är det bara att aktivera egenskapen för detta på kontrollen, "useHash=true", jag kan även sätta vilken panel som ska vara laddad som standard när sidan laddas med egenskapen "defaultFacet"




För att visa innehåller i en panel behöver jag nu bara gör en länk med en relativ url som pekar på hashtagen, hashtagen är samma som den nyckel man sätter på panelen
"xp:key=key1". alltså om jag väljer att visa panelen "key1" kommer "key2" automatiskt att gömmas.






man kan också byta vilken panel som visas genom att skriva vanlig javascript
XSP.showContent("#{id:dynamicContent1}","key1")

eller via server side javascript

var c = getComponent("dynamicContent1")
c.show("key1")

Det finns Exempel på detta här


Facbook använder samma teknik (fast inte xPages så klart)

Om ni titta på hur facebook gör när man går mellan olika innehåll så använder dom samma teknik, man sätter en hashtag varje gång man byter mellan tex News och Messages.
notera också att du kan skriva något i "Search" rutan på facebook och den texten står kvar även när du switchar mellan dom olika sektionerna, dvs det är bara innehållet under den blåa headern på facebook som ändras när man byter sektion. (den sektion jag ramat in med brunt i bilden nedan)

anledningen att man använder en hashtag istället för att använda tex parametrar i url:en är för att webläsarna/javascript tillåter bara att man ändrar det som står efter "#" i en url.
vill man ändra något annat i url:en än det som står efter "#" måste hela sidan laddas om och det vill vi inte här.






Övrigt:

- Med "Dynamic content" måste fortfarande all data i panelen laddas varje gång du väljer att visa panelen
- Jag upptäckte att det verkar hårdkodat att hashtagen ska heta "content", jag la in en request att detta ska vara mer dynamiskt här
- Enda skillnaden jag märkt mellan att använda" Dynamic content" och ett vanligt ajax request i xPages med partial refresh, är att du får med dig en hashtag "gratis"
- oavsett om du använder client side javascript eller server side javascript för att ladda om panelerna så behövs en tripp till servern för att hämta innehållet.
- Dynamic Content använder sig av "facets" för att ladda om data, denna tag sätts inte automatiskt när man drar ut sin kontroll utan måste sättas manuellt i source pane, <xp:this.facets></xp:this.facets>



Snabbguide för att testa kontrollen Dynamic Content i Extension Lbrary

#1. Skapa en xPage och dra ut kontrollen "Dynamic Content" ( installera och aktivera extension library först )
#2. Lägg till facet taggen <xp:this.facets></xp:this.facets> och två paneler inuti denna samt lägg till xp:key="???" i dessa enligt bilden nedan samt lägg in innehåll i panerna
#3. Dra ut två "link controls" på din xpages och sätt url:en på dessa till den nyckel du satt på dina kontroller tex. "#content=minnyckel"






Relevanta Poster på Notessidan:



Fler Poster om:

Fler bloggar om:

Technorati:

Delicious:
Publicerad 2011-02-13 | Kommentarer: 0 | Läsningar:

Kommentarer

No documents found



Sök på Notessidan
Thomas Adrian
ThomasCertifierad utvecklare och administratör inom Notes & Domino

Kontakta mig







Senaste Sökningarna på Notessidan
Sön - sharepoint (R:1)
Sön - räkna and antal and besökare (R:0)
Sön - browser (R:17)
Sön - stoppar and mail (R:1)
Sön - korrupt (R:3)
Sön - böcker (R:0)
Sön - kalendern (R:12)
Sön - feature (R:15)
Sön - print and mime (R:2)
Sön - länka (R:0)
Sön - databasen (R:94)
Sön - access (R:47)
Sön - outlook (R:15)
Sön - webanvändare (R:0)
Sön - google and maps (R:6)
Sön - juffe (R:2)
Sön - uidoc.print (R:1)
Sön - java and lotusscript (R:26)
Sön - besök (R:0)




Databasstatistik Blogg
Uppdateras var 15:e Minut

Antal Poster:562
Antal Kommentarer: 1378
Alla sidvisningar idag:
Unika Besökare idag:
Databasstorlek: 178,5Mb
Fixup: 2019-07-15 00:31:17
FT:2019-07-16 03:10:24
DB Procent använd: 99,5
Antal Agenter: 42
Antal Formulär: 65
Antal Vyer: 60
Antal Dokument: 7927
Antal Image Resources: 108
Antal Subformulär: 18
Antal Scriptbibliotek: 11
Totalt Antal Designelement: 576
Antal Attachments: 159
Antal Konflikter: 0
Server version 1: 405
Server version 2: Release 9.0.1FP9|August 14, 2017
Server Plattform: Windows/64
Ändrad: 2019-07-16 04:40:25
Server Tidszon: Z=-1$DO=1$DL=3 -1 1 10 -1 1$ZX=131$ZN=W. Europe
Region:
Kommentarsspam Idag: 3
Kommentarsspam Totalt: 17897


BlogRankers.com

Top Sites at iWEBTOOL.com

Fight Spam! Click Here!

Bloggtoppen.se

Listed on BlogShares

Increase website traffic

Top Internet Blogs

Site Checker