Dit is een andere post in mijn aan de gang zijnde reeks over hoe te gebruiken jQuery met SharePoint.
Als u wilt meer weten over jQuery, I recommend highly: jQuery in actie door Bear Bibeault en Yehuda Katz.
Aan de slag met jQuery in SharePoint is verrassend eenvoudig (voor mij). (Ik heb ernstige vragen over een "best practices"-benadering voor het implementeren van deze dingen tot productie, maar dat is voor een andere dag). Ik heb net begon te spelen met deze technologie en te dien einde, Ik heb gemaakt een sandbox-omgeving te gebruiken. Als u op zoek bent om te beginnen met jQuery, u kunt deze aanpak nuttig vinden.
1. Een lege Site maken
Maak een lege site ergens in uw site en noem het iets slim als "jQuery Sandbox".
2. JQuery downloaden
U kunt de jQuery javascript library downloaden vanaf hier: http://docs.jquery.com/Downloading_jQuery
Sla dat op uw bureaublad.
Mij zijn geweest using de "minified" versie.
3. Een SharePoint-documentbibliotheek maken
In uw sandbox-site, een documentbibliotheek maken.
4. De jQuery bibliotheek uploaden naar SharePoint
Toegang tot de documentbibliotheek die u zojuist hebt gemaakt en het uploaden van de bibliotheek jQuery.
5. Een aangepaste SharePoint-lijst maken
Ik ben begonnen met een aangepaste lijst, omdat ik wil muck over met standaard SharePoint-formulieren. U kunt ook een pagina in een bibliotheek van pagina's of pagina's met webonderdelen en waarschijnlijk een heleboel andere plaatsen.
Sommige kolommen toevoegen aan de aangepaste lijst zodat u iets om uit te voeren jQuery tegen hebben. Mijn oorspronkelijke doelstellingen moesten:
- Een veld verbergen.
- Een waarde aan een veld toewijzen.
Met dat doel voor ogen, Ik voegde twee tekstvelden. Na verloop van tijd, Ik zal spelen met links, afbeeldingen, zoekacties, etc.
6. De pagina NewForm.aspx Web te wijzigen en een webonderdeel Inhoudseditor toevoegen
Dit is een kleine zwarte magic-ish , in die zin dat het een nieuw concept aan me. Ik voor het eerst geleerd over dit van Paul Grenier, SharePoint jQuery Superstar, op zijn CodePlex projectsite: http://spff.codeplex.com/.
Volg deze stappen om een CEWP aan de zelfde pagina dat NewForm.aspx voor elke aangepaste lijst toont toevoegen:
- Toegang tot de aangepaste lijst en klik op nieuw.
- Het volgende aan de URL toevoegen: Paginaweergaves = gedeeld&ToolPaneView = 2
Dat zal transformeren uw saaie vanille formulier voor gegevensinvoer van iets als dit:
Daartoe:
Het webonderdeel Inhoudseditor toevoegen aan de pagina.
7. Schrijven van uw eerste jQuery Code
Open te stellen dat CEWP in de codeweergave en voeg het volgende toe:
Hier is de werkelijke code als u wilt kopiëren en plakken:
<script type ="text/javascript"
src =".. /.. /jQuery Library/jQuery-1.3.2.min.js">
</script>
<script type ="text/javascript">
$(functie() {
$('#resultsID').HTML("Er zijn" + $('a').grootte() + 'een tags tags op deze pagina.');
});
</script>
Resultaat:
<div id ='resultsID'></div>
/resultaat
|
Merk op dat de eerste <script> Label referencement de werkelijke jQuery bibliotheek. Vermoedelijk, deze dingen veranderen in de tijd, dus u zult willen ervoor zorgen u een) Gebruik de juiste naam en b) verwijzen naar de juiste SharePoint-documentbibliotheek.
Koesteren in de glorie
Als u het goed hebt gedaan, ziet u een resultaat vergelijkbaar met de volgende:
Het verpakken omhoog
Dit is niet de enige manier om te beginnen, maar het is snel, gemakkelijk en geïsoleerde van uw bestaande SharePoint-omgeving.
</einde>
Abonneren op mijn blog.
Volg mij op Twitter op http://www.twitter.com/pagalvin