Dette er en annen post i min pågående serien om hvordan du bruker jQuery med SharePoint.
Hvis du vil lære mer om jQuery, Jeg anbefaler: jQuery i aksjon Bjørn Bibeault og Yehuda Katz.

Komme i gang med jQuery i SharePoint er overraskende lett (til meg). (Jeg har alvorlige spørsmål om en "best praksis" tilnærming til å distribuere disse ting til produksjon, men det er for en annen dag). Jeg har nettopp begynt å spille med denne teknologien og at, Jeg opprettet en sandkasse miljø å bruke. Hvis du ønsker å komme i gang med jQuery, du finner dette nyttig.

1. Opprette et tomt område

Opprette et tomt område et sted på området og kaller det noe smart som "jQuery Sandbox".

2. Last ned jQuery

Du kan laste ned jQuery javascript biblioteket fra her: http://docs.jquery.com/Downloading_jQuery

Lagre det på skrivebordet.

Jeg har brukt den "minified" versjonen.

3. Opprette et SharePoint-dokumentbibliotek

På webområdet sandkasse, Opprett et dokumentbibliotek.

4. Laste jQuery biblioteket til SharePoint

Åpne doc biblioteket du nettopp opprettet og laste opp jQuery biblioteket.

5. Opprette en egendefinert SharePoint-liste

Jeg har begynt med en egendefinert liste fordi jeg ønsker å muck om med standard SharePoint-skjemaer. Du kan også opprette en side i sider-biblioteket eller webdel-sider og sannsynligvis mange andre steder.

Legge til noen kolonner i den egendefinerte listen slik at du har noe å kjøre jQuery mot. Mitt første mål var å:

1. Skjule et felt.
2. Tilordne en verdi til et felt.

Med dette målet i tankene, Jeg har lagt to tekstfelt. Over tid, Jeg skal spille med koblinger, bilder, oppslag, osv..

6. Endre NewForm.aspx webdel-siden og legge til en webdel for innholdsredigering

Dette er en liten svart magic-ish , i at det er et nytt konsept for meg. Jeg først hørte om dette fra Paul Grenier, SharePoint jQuery Superstar, på hans CodePlex prosjektområde: http://spff.codeplex.com/.

Følg denne fremgangsmåten for å legge til en CEWP på samme side som viser NewForm.aspx for en egendefinert liste:

1. Tilgang til den egendefinerte listen og klikk ny.
2. Legg følgende til URL: Sidevisning = delte&ToolPaneView = 2

Som vil forandre din kjedelig vanilje dataregistreringsskjema fra noe som dette:

Dette:

Legge til webdelen for innholdsredigering på siden.

7. Skrive din første jQuery koden

Åpne opp som CEWP i kode-visning og legge til følgende:

Her er den faktiske koden hvis du vil lime inn:

<script type ="text/javascript"
    src =".. /.. /jQuery Library/jQuery-1.3.2.min.js">
</skriptet>

<script type ="text/javascript">
  $(funksjonen() {

    $('#resultsID').HTML("Det er" + $("a").størrelse() + "en tags koder på denne siden.");

  });
</skriptet>

Resultatet:
<div id ='resultsID'></div>
/resultatet

Merk at først <skriptet> kode refererer faktisk jQuery biblioteket. Antagelig, disse tingene endres over tid, så må du sørge for at du en) bruke riktig navn og b) Pek til riktig SharePoint-dokumentbiblioteket.

Snakk

Hvis du gjorde det riktig, du vil se et resultat som ligner på følgende:

Innpakning opp

Dette er ikke den eneste måten å komme i gang, men det er rask, lett og isolert fra eksisterende SharePoint-miljøet.

</slutten>

Abonner på bloggen min.

Følg meg på Twitter på http://www.twitter.com/pagalvin