Detta är en annan post i min pågående serie om hur du använder jQuery med SharePoint.
Om du vill veta mer om jQuery, Jag rekommenderar: jQuery i aktion av Björn Bibeault och Yehuda Katz.
Det är förvånansvärt enkelt att komma igång med jQuery i SharePoint (Till mig). (Jag har allvarliga frågor om en "best practices" metod att distribuera dessa saker till produktion, men det är för en annan dag). Jag har precis börjat spela med denna teknik och därför, Jag skapade en sandlåda miljö att använda. Om du vill komma igång med jQuery, Du kan hitta detta tillvägagångssätt användbara.
1. Skapa en tom webbplats
Skapa en tom webbplats någonstans i din webbplats och kallar det något smart som "jQuery Sandbox".
2. Hämta jQuery
Du kan hämta den jQuery javascript biblioteket här: http://docs.jquery.com/Downloading_jQuery
Spara det till på skrivbordet.
Jag har blitt användande den "minified" versionen.
3. Skapa ett SharePoint-dokumentbibliotek
I din sandlåda webbplats, skapa ett dokumentbibliotek.
4. Ladda jQuery biblioteket till SharePoint
Åt doc biblioteket du just skapade och ladda jQuery biblioteket.
5. Skapa en anpassad SharePoint-lista
Jag har börjat med en anpassad lista eftersom jag vill slänga med SharePoint standardformulären. Du kan också skapa en sida i ett bibliotek för sidor eller webbdelssidor och förmodligen en massa andra ställen.
Lägga till vissa kolumner i listan anpassad så att du har något att köra jQuery mot. Min ursprungliga mål var att:
- Dölja ett fält.
- Tilldela ett värde till ett fält.
Med detta mål i åtanke, Jag la två textfält. Över tid, Jag ska spela med länkar, bilder, uppslag, m.m..
6. Ändra webbdelssidan NewForm.aspx och lägga till webbdelen Innehållsredigeraren
Detta är en liten svart magic-ish , att det är ett nytt koncept för mig. Jag lärde mig först om detta från Paul Grenier, SharePoint jQuery Superstar, på hans CodePlex project-webbplats: http://spff.codeplex.com/.
Följ dessa steg för att lägga till en CEWP på samma sida som visar NewForm.aspx för någon anpassad lista:
- Få tillgång till den anpassade listan och klicka på ny.
- Lägga till följande URL:: Sidvisning = delade&ToolPaneView = 2
Som kommer att förvandla din tråkiga vanilj datainmatningsformulär från något sådant:
Till detta:
Lägga till webbdelen Innehållsredigeraren på sidan.
7. Skriva din första jQuery kod
Öppna det CEWP i kodvyn och lägga till följande:
Här är den faktiska koden om du vill klistra in:
<script typ ="text/javascript"
src =".. /.. /jQuery Library/jQuery-1.3.2.min.js">
</skript>
<script typ ="text/javascript">
$(funktionen() {
$("#resultsID").HTML("Det finns" + $("a").storlek() + "en Taggar Taggar på denna sida.");
});
</skript>
Resultat:
<DIV id ="resultsID"></div>
/resultat
|
Observera att först <skript> tag refererar till faktiska jQuery biblioteket. Förmodligen, dessa saker förändras över tiden, så ska du se till att du en) använda den rätt namn och b) Peka på korrekt SharePoint-dokumentbiblioteket.
Sola sig i glansen
Om du gjorde det rätt, du ser ett resultat som liknar följande:
Inslagning
Detta är inte det enda sättet att komma igång, men det är snabbt, lätt och isolerade från befintliga SharePoint-miljön.
</slutet>
Prenumerera på min blogg.
Följ mig på Twitter vid http://www.twitter.com/pagalvin