Tag-arkiver: jQuery

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:

image

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):

image

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

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:

image

 

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

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:

image

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

Hurtige Tip: Føje jQuery til MOSS udgivelsessider

1 Svar

Når styrkelse af MOSS publising sider ved hjælp af jQuery, Jeg ramt den følgende hastighed bump:

Serverfejl i ' /’ Ansøgning.

Parserfejl

Beskrivelse: Der opstod en fejl under parsingen af en ressource, der er nødvendige for at behandle denne anmodning. Læs de følgende detaljer om parsefejlen, og foretag de nødvendige ændringer af kildefilen.

Parser fejlmeddelelse: Kun er indholdskontrolelementer tilladt direkte på en indholdsside, der indeholder indholdskontrolelementer.

Kilde fejl: 

 
Line 10: 
Line 11: 
Line 12: <script 
Line 13:     type="text/javascript" 
Line 14:     src="/jQuery/jquery-1.4.min.js">

Kildefil: /_catalogs/masterpage/KCC_FacultyMember.aspx    Linje: 12

Versionsoplysninger: Microsoft .NET Framework Version:2.0.50727.4927; ASP.NET-versionen:2.0.50727.4927

Det var let nok at lave (h/t til min kollega, Uday Ethirajulu).  Sørg for, at jQuery kode bor inde i "PlaceHolderAdditionalPageHead" som vist:

<ASP:Indhold ContentPlaceholderID = "PlaceHolderAdditionalPageHead" RUNAT = "server">

<script

    type = text/javascript""

    src="/jQuery/jQuery-1.4.min.js">

</script>

<script type = "tekst/javascript">

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

   // Strålende jQuery ting går her.

   });

</script>

</slutningen>

Abonner på min blog.

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