Vinnige en maklike: Skep Jou Eie jQuery Sandbox vir SharePoint

Dit is nog 'n post in my aan die gang reeks oor hoe om te gebruik jQuery met SharePoint.
As jy wil meer oor jQuery te leer, Ek raai: jQuery in Aksie deur die Bear Bibeault en Yehuda Katz.

Kom ons begin met jQuery in SharePoint is verbasend maklik (vir my). (Ek het ernstige vrae oor 'n "beste praktyke" benadering tot die implementering van hierdie dinge aan die produksie, Maar dit is vir 'n ander dag). I’ve just started playing with this technology and to that end, I created a sandbox environment to use. If you’re looking to get started with jQuery, jy kan vind hierdie benadering nuttig.

1. Skep 'n leë webwerf

Skep 'n leë plek iewers in jou werf in en noem dit iets slim soos "jQuery Sandbox".

2. Aflaai jQuery

Jy kan die jQuery JavaScript-biblioteek van hier aflaai: http://docs.jquery.com/Downloading_jQuery

Behalwe dat jou rekenaar.

Ek het al met behulp van die "minified" weergawe.

3. Skep 'n SharePoint Document Library

In jou sandput werf, create a document library.

4. Laai die jQuery Biblioteek SharePoint

Toegang tot die doc biblioteek jy net gemaak het en laai die jQuery biblioteek.

5. Skep 'n Custom SharePoint Lys

I’ve started with a custom list because I want to muck about with standard SharePoint forms. You could also create a page in a pages library or web part pages and probably a lot of other places.

Add some columns to the custom list so that you have something to run jQuery against. My initial objectives were to:

  1. Steek 'n veld.
  2. Ken 'n waarde aan 'n veld.

Met dié doel voor oë, I added two text fields. Over time, Ek sal speel met skakels, beelde, soektogte, ens..

6. Verander die NewForm.aspx Web Deel Page en voeg 'n redakteur Web Deel

Dit is 'n klein swart magie-ish , in that it’s a new concept to me. I first learned about this from Paul Grenier, SharePoint jQuery Superstar, by sy CodePlex projek site: http://spff.codeplex.com/.

Volg hierdie stappe om om 'n CEWP te voeg by die dieselfde bladsy wat toon NewForm.aspx, vir 'n persoonlike lys:

  1. Toegang tot die persoonlike lys en klik op nuwe.
  2. Voeg die volgende by die URL: Pageview = Gedeelde&ToolPaneView = 2

Dit sal jou vervelige vanielje data inskrywingsvorm transformeer van iets soos hierdie:

image

Om hierdie:

image

Voeg die inhoud redakteur web deel na die bladsy.

7. Skryf jou eerste jQuery Kode

Maak dat CEWP in die kode oog en voeg die volgende:

image

Hier is die kode as jy wil kopieer / plak:

<script
    "Teks / javascript"
    src ="../../jQuery Library/jquery-1.3.2.min.js">
</script>

<script type ="Teks / javascript">
  $(funksie() {

    $("# ResultsID").html("Daar is ' + $("A").grootte() + 'N tags tags op hierdie bladsy. ");

  });
</script>

Uitslag:
<div id ='ResultsID "></Div>
/lei

Let daarop dat die eerste <script> tag is referencing the actual jQuery library. Presumably, hierdie dinge verander met verloop van tyd, sodat jy wil maak seker dat jy 'n) gebruik die regte naam en b) wys dit na die korrekte SharePoint dokument biblioteek.

Koester in die heerlikheid

As jy het dit reg, sien jy 'n resultaat soortgelyk aan die volgende:

image

Wikkel

Dit is nie die enigste manier om te begin, maar dit is vinnig, easy and isolated from your existing SharePoint environment.

</einde>

Skryf in op my blog.

Volg my op Twitter http://www.twitter.com/pagalvin

2 gedagtes oor "Vinnige en maklike: Skep Jou Eie jQuery Sandbox vir SharePoint

  1. sujith krish

    Have you noticed that adding CEWP in editform.aspx would break the page and version information section shows up in the UI? Any workarounds for this?

    Anyone ?

    Antwoord

Laat 'n antwoord

Jou e-posadres sal nie gepubliseer word nie. Verpligte velde gemerk *