Kategori Arkiv: jQuery og SharePoint

Overvinde irriterende Problem med Relative URL-adresser i SharePoint rask indlede

Jeg ønskede at tilføje et link til hurtig start navigation forleden og SharePoint fortalte mig:

Ren tekstversion af der er:

Sikre, at Webadressen er gyldig og begynder med enten et gyldigt tegn (et nummertegn (#) eller skråstreg (/)) eller en gyldig understøttet protokol (for eksempel, ' http://’, ' https://’, ' fil://’, ' ftp://’, ' mailto:’, «Nyheder:’).

"Blech og pox!"Jeg sagde.

En løsning til dette er at bruge JavaScript til at finde en kendt link i den rask indlede og tilsidesætte sin opførsel.

At teste dette, føje et nyt link til webstedet test thusly:

Jeg brugte jQuery. At løse det, få nogle JavaScript og jQuery til siden ved hjælp af din foretrukne teknik og med en linje kode på denne:

$(dokument).klar til( funktion () {

    $("en:indeholder("Test URL udskiftning")").Klik på(funktion () { alarm("ændrede Klik adfærd!"); tilbagevenden falsk;});

});

Og Bob er din onkel.

JQuery selector finder hver <en> Tag, der har "Test URL udskiftning" i sit navn. Du kan finde-tune, afhængigt af din link og sådan.

Af .click(funktion() tilsidesætter uanset SharePoint ville have gjort, når brugeren klikker på. Sørg for, at du "returnerer false" eller andet, det vil gøre dit kram og derefter prøve at href ting også, der er næsten helt sikkert ikke dit mål.

Dette blev gjort og test i et SharePoint online miljø men bør arbejde godt i 2010 og tidligere for.

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Hurtig og enkel: Løse "Ugyldig URL-Parameter” problemet med UpdateListItems i lists.asmx

1 Svar

Når du arbejder med UpdateListItems via lists.asmx, Det er let at generere en fejl:

Ugyldig URL-Parameter.

Den webadresse, der indeholder en ugyldig kommando eller værdi. Tjek venligst URL'EN igen.

Du kan få denne fejl, når du glemmer at medtage ID i den liste over felter for at opdatere. Dette, ligesom mange af disse SP webtjenester, er en smule ulogisk, da du skal medtage ID i attributten ID af den <Metode> element. Og du er ikke opdateret ID og sandsynligvis aldrig vil i første omgang.

Denne SOAP-konvolutten fungerer:

<soapenv:Konvolut xmlns:soapenv =' http://schemas.xmlsoap.org/SOAP/Envelope/'>
  <soapenv:Organ>                      
    <UpdateListItems xmlns =' http://schemas.Microsoft.com/SharePoint/SOAP/'>                     
      <Listenavn>{C712E2EA-54E1-47AD-9D99-1848C7773E2F}</Listenavn>                     
        <opdateringer>                     
         <Batch VedFejl ="Fortsæt">
          <Metode ID ="1" Cmd ="Update">
            <Feltet navn ="CooperativeLock">låst!</Felt>
            <Feltet navn ="ID">1</Felt>
          </Metode>
        </Batch>                     
        </opdateringer>                
      </UpdateListItems>             
  </soapenv:Organ>         
</soapenv:Konvolut>

Hvis du strip ud id-feltreference så får du meddelelsen irriterende "Ugyldig URL-parameter".

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Fattig mand Caching i JavaScript

1 Svar

[TL;DR version: Brug cookies til at gemme resultaterne af async opkald; gengive resultaterne af tidligere async opkald straks og derefter validere dem efter side-belastning.]

Jeg har arbejdet på SharePoint intranet site for en klient at funktioner, blandt andet, en stiliseret sekundær navigation hvis menuindstillinger styres via en almindelig gamle brugerdefineret liste. Ideen er at klienten får lov til at kontrollere menuen "deres" websted uden at påvirke eller påvirkes af den globale navigation sat ud af det.

(der er noget utrolig undergravende om tilføjelse af en CEWP, der peger på en HTML-fil for at indlæse nogle CSS og JS fundamentalt ændre næsten alt om et websteds opførsel... men det er for en anden post)

Koden for denne smukke enkle:

Vente på siden for at afslutte lastning og gøre en asynkron hidkalde hen til ladning oppe menu artikler på en liste ved hjælp af resten eller lists.asmx eller hvad
Ved hjælp af jQuery, dynamisk udfylde en bunke, hvis <Li>er inde i en overordnet <UL> (Se Christian Pinder artiklen her for en forenklet forklaring på denne tecnnique)
Brug CSS til at gøre al formatering
Profit!

Den sore spot her er, at hver gang nogen hits en af webstedets sider, brugerens webbrowser er at nå ud til at få elementer på listen. Når dev er komplet og test har bevist ting at være stabil og komplet, denne indkaldelse er unødvendige mere end 99% tid siden menuen sjældent ændres. Det har også en underlig UI indflydelse, som er almindeligt i denne fagre nye verden af hyper-ajaxy websteder – siden renders og først derefter gør menuen. Det er nervøs og distraherende efter min mening. Og nervøs. Så, cachelagring.

Jeg har ændret logikken thusly:

Kigge efter en cookie i den browser, der indeholder menuen, som jeg sidst læste det

Hvis fundet, gøre det straks. Vent ikke til siden for at afslutte læsning. (Du skal sørge for din HTML er strategisk placeret her, men det er ikke svært at gøre).

Vente på siden for at afslutte lastning og gøre en asynkron hidkalde hen til ladning oppe menu artikler på en liste ved hjælp af resten eller lists.asmx eller hvad
Undersøg hvad jeg fik mod cookie

Hvis det passer, Stop
Ellers, ved hjælp af jQuery, dynamisk udfylde en bunke, hvis <Li>er i en <UL>

Brug CSS til at gøre al formatering
Profit!

Nogle af jer vil sige, "hey! der er ingen reel caching vej på her, da du læser menuen alligevel hver eneste gang.” Og du har ret-jeg vil ikke give serveren nogen form for pause. Men fordi opkaldet er asynkrone og sker efter siden 's oprindelige HTML nyttelast gengiver fuldt, det føles"" mere lydhøre over for brugeren. Menuen gør temmelig meget som siden trækker. Hvis menuen sker til ændringen, brugeren er udsat for en nervøs re-drage i menuen, men kun denne ene gang.

Der er nogle måder at gøre dette caching mere effektivt og hjælpe serveren på samme tid:

Sat i en regel at "cookie-cache" er gyldig i mindst 24 timer eller nogle andre tidsramme. Så længe der er ingen udløbet cookie, bruge den cookie menuen øjebliksbillede og aldrig ramte serveren.

Tja... det er alt, der kommer til at tænke lige nu :).

Hvis nogen har nogen kloge tanker her ville jeg elske at kende dem.

Og endelig – denne teknik kan bruges til andre ting. Denne klient side har en række datastyrede ting på forskellige sider, mange af dem ændre relativt sjældent (ligesom en gang om ugen eller en gang om måneden). Hvis du er målrettet mod specifikke områder af funktionalitet, Du kan give en mere lydhør UI ved at trække indholdet fra den lokale cookie butik og rendering straks. Det føles hurtigere til brugeren selv hvis du ikke gemmer serveren enhver cyklusser. Du kan Gem serveren cyklusser ved at beslutte på visse betingelser og udløsere til at afkræfte denne lokale cookie cache. Det er alle situationsbestemt og kunstnerkvarteret ting og virkelig den mest sjov :).

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

XSLT og jQuery prøver

2 Svar

Jeg har gjort en masse af XSLT og jQuery og tænkte jeg deler et par uddrag, som andre kan finde nyttige i fremtiden.

Eksempel 1: Udsende enkel JavaScript / jQuery i XSLT:

<XSL:skabelon match = "noget" XML:plads = "bevare">

<!– Tomt ud forespørgselsfelt venlige filtre skjulte –>
<script type = "tekst/javascript">
    $(dokument).klar til(funktion(){
      $("#QueryFriendlyFilters").Val("tom");
    });
</script>

</XSL:skabelon>

Denne bit udsender nogle JavaScript, der venter på siden for at afslutte indlæsning (på grund af den $(dokument).klar til(…)) og derefter indstiller værdien af et skjult felt opkaldt QueryFriendlyFilters til konstantværdi "tom".

Eksempel 2: Brug <XSL:Hvis> at kontrollere "større end", "mindre end", osv.

<XSL:skabelon match = "noget" XML:plads = "bevare">

<div id = "fdcAllFilters">

    <XSL:Hvis test="@Count>0">
      <kalibreringsgas klasse = "fdcFilterLabel">Aktuelle filtre:</span>
    </XSL:Hvis>

    <!– flere ting sker her. –>

</XSL:skabelon>

Den ovennævnte snippet kontrollerer, hvis en attribut med navnet "Tæller" i elementet "noget" er større end nul. XML bag dette ville være noget:”

<noget Count = "5" />

Eksempel 3: Iterere gennem alle elementer, indsætte jQuery opkald.

<!– Iterere gennem alle filtrene og vise den korrekte links. –>
<XSL:for hver select = "UserFilter">

<en klasse = "FilterHref" href = "javascript:mySubmitPage('RemoveUserFilter','{@ ID}’)">[X]</en>

<kalibreringsgas klasse = "fdcFilterLabel"><XSL:værdi-af select="@FilterValue"/></span>

<script type = "tekst/javascript">

    $(dokument).klar til(funktion(){
        <XSL:tekst><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></XSL:tekst>\"<XSL:værdi-af select="@FilterValue"/>\"<XSL:tekst><![CDATA["));]]></XSL:tekst>
    });

</script>

</XSL:for hver>

Den ovennævnte snippet er den mest komplekse og kan der lettere måder at gøre det.

XML bag dette ser nogenlunde sådan ud:

<UserFilter ID = "123" FilterValue = "xyzzy" />

Denne snippet iterere gennem <UserFilter> noder.

Det første udsender et anker mærke, når der klikkes på påberåber sig en JavaScript-funktion, der allerede er på siden, "mySubmitPage" og passerer værdien af en attribut den <UserFilter> node med navnet "ID".

Det udsender derefter nogle jQuery, som venter på siden for at indlæse. At jQuery opdaterer et skjult felt med navnet "QueryFriendlyFilters" ved at tilføje værdien af attributten FilterValue. Bemærk alle crazy <XSL:tekst> og <![CDATA[ … ]]> Stuff.

Det er det, håbe, det hjælper!

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Lists.asmx, GetListItems og mapper

6 Svar

Jeg gjorde nogle forskning for nogen i dag omkring tjenesten list.asmx web leveres som del af SharePoint 2010 (og tidligere). Hun kunne få listeelementerne på rodmappen (herunder navnene på undermapper), men kunne ikke få elementer i undermapper. Jeg gjorde nogle ser på internets, og det er et overraskende fælles spørgsmål. Endnu, Jeg kunne ikke hentes et godt svar på den enkle spørgsmål, "Hvis jeg kender mappen, Hvordan får jeg elementerne i mappen?” At være ærlig, Jeg forsøge ikke alt, hårdt, da jeg har villet figur denne ene ud på min egen i et stykke tid Smil .

At definere dette, Jeg har oprettet et websted med navnet "Blogging scenarier" og en brugerdefineret liste med navnet "Brugerdefineret liste med Sub mapper". Jeg derefter oprettes mapper med navnet:

År 2005
År 2006
År 2007

Jeg har tilføjet et par elementer i mappen "År 2006". Dette er, hvad det ligner:

Min ven ikke skriver C# kode, men snarere ved hjælp af Java, SOAP-konvolutten var så hvad hun virkelig nødvendig. At få, Jeg skrev et bit af jQuery og derefter bruges spillemand for at få den faktiske http-samtale.

Her er den relevante jQuery (Jeg kopieres koden ned nedenfor, hvis du vil kopiere/indsætte):

De første nøgle er at medtage både en <queryOptions> og <QueryOptions> node. Den anden nøgle er den <Mappe> noden er en URL-adresse, som klienten har adgang.

Der kan være andre måder at få dette, Men dette arbejdede godt for mig, når du bruger jQuery.

Her er SOAP-konvolutten for ovenstående:

<soapenv:Konvolut xmlns:soapenv =’http://schemas.xmlsoap.org/SOAP/Envelope/’>
<soapenv:Organ>
    <GetListItems xmlns =’http://schemas.Microsoft.com/SharePoint/SOAP/’>
      <Listenavn>Brugerdefineret liste med Sub mapper</Listenavn>
      <viewFields>
        <ViewFields>
          <FieldRef navn =' titel’ />
          <FieldRef navn ='EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Mappe>http://demoserver1/Blogging Scenarier/lister/brugerdefineret liste med Sub mapper/år 2006</Mappe>
        </QueryOptions>
      </queryOptions>
    </GetListItems>
</soapenv:Organ>
</soapenv:Konvolut>

En masse eksempler og diskussion omkring dette ført mig til at tro at all I need var <QueryOptions> og angive et mappenavn. For mig, Jeg har brug for begge ombryde det inde <queryOptions> samt angive en fuldt kvalificeret URL-adressen til den <Mappe> node.

Her er opsætningen jQuery AJAX:

$(dokument).klar til(funktion() {
       var soapEnv =
           "<soapenv:Konvolut xmlns:soapenv =’http://schemas.xmlsoap.org/SOAP/Envelope/’> \
               <soapenv:Organ> \
                    <GetListItems xmlns =’http://schemas.Microsoft.com/SharePoint/SOAP/’> \
                       <Listenavn>Brugerdefineret liste med Sub mapper</Listenavn> \
                       <viewFields> \
                           <ViewFields> \
                              <FieldRef navn =' titel’ /> \
                              <FieldRef navn ='EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Mappe>http://demoserver1/Blogging Scenarier/lister/brugerdefineret liste med Sub mapper/år 2006</Mappe> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Organ> \
           </soapenv:Konvolut>";

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Lists.asmx, GetList og "værdi kan ikke være null”

1 Svar

Jeg opdagede i dag, GetList() metode i lists.asmx webtjenesten har kaldt meget omhyggeligt, eller det er tilbøjelige til at smide en mystisk "Værdi kan ikke være null" undtagelse (og antages kan du få forbi den endnu værre generiske fejlmeddelelse, "Undtagelse af typen ' Microsoft.SharePoint.SoapServer.SoapServerException’ der blev udløst.") Specifikt, Jeg fandt, at du ikke kan give nogen form for præfiks på metoden GetList. Den følgende jQuery snippet illustrerer punktet:

Hvis du gør det, Webtjenesten svarer med "Værdi kan ikke være null" som pr. dette spillemand-forudsat http-transcript:

<?XML version = "1.0" encoding = "utf-8"?>
<SOAP:Konvolut
     xmlns:SOAP ="http://schemas.xmlsoap.org/SOAP/Envelope/"
     xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance”
     xmlns:XSD ="http://www.w3.org/2001/XMLSchema">

<SOAP:Organ>
    <SOAP:Fejl>
      <faultcode>SOAP:Server</faultcode>
      <faultString>
        Undtagelse af typen ' Microsoft.SharePoint.SoapServer.SoapServerException’ der blev udløst.
      </faultString>
      <detaljer>
        <ErrorString xmlns ="http://schemas.Microsoft.com/SharePoint/SOAP/">
Værdi må ikke være null.
        </ErrorString>
      </detaljer>
    </SOAP:Fejl>
</SOAP:Organ>
</SOAP:Konvolut>

Selvfølgelig, du ville sandsynligvis tilføje denne "s0" præfiks på dine egne, men nogle værktøjer er tilbøjelige til at gøre det. (ligesom Eclipse).

Dette er så meget desto mere forvirrende / frustrerende fordi andre metoder tolerere præfikser. For eksempel, den GetListCollection metode huske ikke, hvis det er blevet præfikset, selv med nonsens præfikser ligesom "xyzzy":

Dette "værdi ikke kan være null" forekommer temmelig fælles med lists.asmx så forhåbentlig dette vil hjælpe en anden person ud i fremtiden.

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Uendelige indlejring <div> Mærker og jQuery

Efterlad et Svar

Dette synes at være sådan en oddball emne, Jeg er ikke sikker på, at det er virkelig værd at blogging om, men der er aldrig stoppet mig før, så her gå vi Smil

Jeg arbejder på et projekt, hvor jeg trækker nogle data fra en søgning, emballage det i en XML-besked og derefter at XML er i sidste ende omdannes til HTML via XSLT. Der er en masse af jQuery involveret, en smule som implementerer nogle Tabber funktionalitet. Når du klikker på en fane (Virkelig, en <div>), jQuery påberåber sig .hide() og .show() på forskellige divs (den første side belastning henter alt indholdet, så der er ingen postbacks i dette tilfælde).

En flok af timer siden, fanen skifte logik begyndte at opføre sig ustabilt og det ville ikke vise en af mine faner. Jeg i sidste ende sporede det ned til faktum, at internet explorer (mindst) troede, at den <div> Tags indlejret langt, langt dybere end beregnet.Udvikler værktøj vil vise:

-<div id = "Tab1Content">
-<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           …………………………
                   </div> <— Endelig viser det var lukket helt ned her!

Så, Hvis jeg gjorde en $("#Tab1Content").Skjul(), Jeg ville også skjule Fane2, og jeg kunne aldrig vise Fane2 hvis jeg ikke også vise Fane1. Jeg har kopieret og indsat koden i visual studio og det viste alle div's foring op pænt, ligesom de skulle gøre, ser ud som dette:

-<div id = "Tab1Content">
+<div>
+<div>
-<div id = "Tab2Content">
+<div>
+<div>

Jeg slog mit hoved mod væggen for et stykke tid og bemærket, at i den faktiske HTML kode genererer en masse tomme <div> Tags, ligesom:

<kroppen>

<div id = "Tab1Content">

    <div id = "row1" />
    <div id = "row2" />

</div>

<div id = "Tab2Content">

    <div id = "row1" />
    <div id = "row2" />

</div>

</kroppen>

(Ovenstående er waaaaaaaaaaaay forsimplede. Tom div tags er helt gyldigt. Nogle af mine <div> Tags var fuld af indhold, men mange flere blev ikke. Jeg kom til erkendelsen at min <XSL:for hver> direktiverne udsender kort form div tags når xsl:for hver gjorde ikke ' finde data. Jeg tvunget en HTML-kommentar til output, som vist:

Efter at jeg gjorde det, alle div foret pænt og min fane skifte begyndte at arbejde.

Som altid, Jeg håber dette hjælper en person i en knivspids.

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Endnu flere jQuery–Ændre størrelsen på et billede eksempel

Efterlad et Svar

Jeg har arvet en webdel fra en klient gamle leverandør, og det har et imageproblem størrelse. Billederne bør 60×50 Men for nogle underlige grund, den oprindelige forhandler tvunget dem til 42×42, så de ser squashed:

Godt billede	Dårligt Image

Her er opmærkningen (lidt forenklet):

<tabel class = 'extended-outlook'>
<thead>
    <Tr>
      <th bredde ='100′>3 Tirsdag</th>
    </Tr>
</thead>

<TBODY>
    <TR class = "prognose">
      <TD bredde ='100′>
        <UL>
          <Li klasse = 'høj'>Høj: 72&DEG;F</Li>
          <Li class = "lavt">Lav: 44&DEG;F</Li>
          <Li class = "stand">Solrig
            <img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/Trans/cond007.png’ bredde ='42’ højde ='42’ alt =” />
          </Li>
        </UL>
      </TD>
    </Tr>

</TBODY>

</tabel>

Du vil bemærke, at selv om den stien til selve billedet viser den korrekte dimension (60×50) den oprindelige leverandør tvunget det i 42×42. Hvorfor? Tosset.

Alligevel, Jeg ønskede en hurtig og nem løsning på dette spørgsmål, og jeg vendte til jQuery. Tricket var at finde alle de relevante <IMG> Tags. Jeg gjorde ikke ønsker at nusse rundt med andre img-tags (hvoraf er der mange). Denne bit af jQuery gjorde tricket:

<script type = text/javascript"" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></script>

<script type = "tekst/javascript">
     $(dokument).klar til(funktion () {

         $(' li.condition > IMG').hver(funktion (indeks, varen)
            {
             $(varen).CSS("bredde", "60");
             $(varen).CSS("højde", "50");
            });
     }); // på dokumentet belastning
</script>

Smule kode finder samlingen <Li> Tags hvis klassen er "tilstand" og <IMG> børn. Det gentages derefter gennem alt dette. Arbejdede lige en indtage.

Jeg kunne nok strømline it, men jeg har aldrig været en form for unix fyr, der løst π til 18 cifre præcision ved hjælp af sed og awk og jeg er ikke slags, hvis jQuery fyr enten Smil .

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Gennemføre en Global affyre-oppe anmeldelsessystem

2 Svar

Jeg skrev op en artikel til www.SharePoint.Briefing.com ret"Gennemføre en Global affyre-oppe anmeldelsessystem.” Denne funktion blev implementeret for en community college for at kommunikere skole hvilestykker på grund af sne og så videre.

Det bruger en brugerdefineret liste, ud af boksen SharePoint web services og nogle jQuery at gøre arbejdet.

Her er en teaser:

Læse det hele her: http://www.sharepointbriefing.com/features/article.php/3918471/Implement-a-Global-Pop-up-Notification-System.htm

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin

Overtage styringen af dit OK og Annuller-knapper

3 Svar

Jeg skrev denne artikel et stykke tid tilbage, Men ser ud til jeg ikke linke til den fra min blog på tidspunktet,, så her går:

Denne artikel beskriver, hvordan du tvinger newform.aspx til at omdirigere til én side, når brugeren klikker på OK, og en anden side når hun klikker på Annuller.

</slutningen>

Abonner på min blog.

Følg mig på kvidre på http://www.twitter.com/pagalvin