Tag-Archive: jQuery

XSLT und jQuery-Beispiele

Ich mache seit viel von XSLT und jQuery und dachte, ich würde ein paar Ausschnitte teilen, die andere in Zukunft nützlich sein können.

Beispiel 1: Einfache JavaScript ausgeben / jQuery in XSLT:

<XSL:Vorlage-Übereinstimmung = "etwas" XML:Space = "preserve">

<!– Die Abfrage freundlich Filter ausgeblendeten Feld leer –>
<Skript-Typ = "Text/Javascript">
    $(Dokument).bereit(Funktion(){
      $("#QueryFriendlyFilters").Val("leer");
    });
</Skript>

</XSL:Vorlage>

Das Bit ausgibt einige JavaScript, das wartet, bis die Seite geladen (wegen der $(Dokument).bereit(…)) und dann der Wert eines ausgeblendeten Felds benannte Mengen QueryFriendlyFilters zu der literale Wert "leer".

Beispiel 2: Verwendung <XSL:If> "größer als" überprüfen, "kleiner als", usw..

<XSL:Vorlage-Übereinstimmung = "etwas" XML:Space = "preserve">

<Div Id = "FdcAllFilters">

    <XSL:Wenn test="@Count>0">
      <span Class = "FdcFilterLabel">Aktuelle Filter:</Spannweite>
    </XSL:If>

    <!– hier passiert mehr Material. –>

</XSL:Vorlage>

Der oben stehenden Ausschnitt prüft, ob ein Attribut namens "Zählen" des Elements "etwas" größer als 0 (null) ist. Der XML-Code dahinter wäre so etwas wie:”

<etwas Count = "5" />

Beispiel 3: Durchlaufen aller Elemente, einstreuen jQuery Aufrufe.

<!– Alle Filter durchlaufen und die korrekte Anzeige Links. –>
<XSL:for-each select = "UserFilter">

<eine Klasse = "FilterHref" Href = "Javascript:mySubmitPage('RemoveUserFilter','{@ ID}’)">[X]</eine>

<span Class = "FdcFilterLabel"><XSL:Wert-der select="@FilterValue"/></Spannweite>

<Skript-Typ = "Text/Javascript">

    $(Dokument).bereit(Funktion(){
        <XSL:Text><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></XSL:Text>\"<XSL:Wert-der select="@FilterValue"/>\"<XSL:Text><![CDATA["));]]></XSL:Text>
    });

</Skript>

</XSL:für jeden>

Der oben stehenden Ausschnitt ist die komplizierteste und möglicherweise gibt es einfachere Wege, es zu tun.

Der XML-Code dahinter sieht ungefähr wie folgt:

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

Dieser Ausschnitt ist durchlaufen <UserFilter> Knoten.

Es gibt zunächst einen Anker kennzeichnen, die beim Klicken auf Ruft eine JavaScript-Funktion, die bereits auf der Seite ist, "MySubmitPage" und übergibt den Wert eines Attributs auf der <UserFilter> Knoten mit dem Namen "ID".

Dann gibt es einige jQuery, die wartet, die Seite zu laden. Dass jQuery aktualisiert ein ausgeblendetes Feld mit dem Namen "QueryFriendlyFilters", indem den Wert des Attributs FilterValue. Beachten Sie alle verrückt <XSL:Text> und <![CDATA[ … ]]> Bestellung.

Das ist es, hoffe es Hilfen!

</Ende>

Onnieren Sie meinen Blog ab.

Folgen Sie mir auf Twitter bei http://www.twitter.com/pagalvin

Lists.asmx, GetListItems und Ordner

6 Antworten

Ich tat etwas Forschung für jemanden heute rund um den list.asmx-Web-Service im Rahmen des SharePoint 2010 (und früher). Sie war in der Lage, die Listenelemente im Stammordner (die Namen der Unterordner), aber Elemente in Unterordner erhalten könnte. Ich habe einige schauen herum auf dem Internets und es ist ein überraschend häufig gestellte Frage. Noch, Ich könnte eine gute Antwort auf die einfache Frage nicht erhalten., "Wenn ich den Ordner weiß, Wie bekomme ich die Elemente in den Ordner?” Um ehrlich zu sein, Ich versuchte nicht allzu hart, da ich zu Figur diesein raus auf eigene Faust für eine Weile wollte Lächeln .

Um dies einzurichten, Ich habe eine Site mit dem Namen "Blogging Scenarios" und eine benutzerdefinierte Liste mit dem Namen "Benutzerdefinierte Liste mit Sub-Ordner". Ich habe dann Ordner mit dem Namen:

Jahr 2005
Jahr 2006
Jahr 2007

Ich hinzugefügt ein paar Elemente in den Ordner "Jahr 2006". Dies ist, wie es aussieht:

Mein Freund ist nicht schreiben von C#-Code, sondern eher mit Hilfe von Java, So war der SOAP-Umschlag, was sie wirklich brauchte. Zu erhalten, die, Ich schrieb ein wenig jQuery und Fiddler dann verwendet, um das tatsächliche HTTP-Gespräch zu erhalten.

Hier ist die relevante jQuery (Ich kopiert den Code unten unten wenn Sie kopieren möchten):

Sie erste Schlüssel ist, um sowohl eine <queryOptions> und <QueryOptions> Knoten. Der zweite Schlüssel ist, dass die <Ordner> der Knoten ist ein URL, auf den der Client Zugriff hat.

Möglicherweise gibt es andere Möglichkeiten, um dies, aber dies funktioniert gut für mich, bei der Verwendung von jQuery.

Hier ist der SOAP-Umschlag für die oben:

<soapenv:Umschlag xmlns:Soapenv =’http://Schemas.xmlsoap.org/SOAP/Envelope/’>
<soapenv:Körper>
    <GetListItems Xmlns =’http://Schemas.Microsoft.com/SharePoint/SOAP/’>
      <listName>Benutzerdefinierte Liste mit Sub-Ordner</listName>
      <viewFields>
        <ViewFields>
          <FieldRef-Name =' Titel’ />
          <FieldRef-Name ='EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Ordner>http://demoserver1-Blogging Szenarien/Listen/benutzerdefinierte Liste mit Sub-Ordner/Jahr 2006</Ordner>
        </QueryOptions>
      </queryOptions>
    </GetListItems>
</soapenv:Körper>
</soapenv:Umschlag>

Viele Beispiele und Diskussion um dies führte mich zu glauben, dass alles, was ich brauche <QueryOptions> und geben Sie einen Ordnernamen ein. Für mich, Ich müssen sowohl in wrap <queryOptions> ebenso wie geben Sie eine vollqualifizierte URL für den <Ordner> Knoten.

Hier ist das jQuery-AJAX-setup:

$(Dokument).bereit(Funktion() {
       Var SoapEnv =
           "<soapenv:Umschlag xmlns:Soapenv =’http://Schemas.xmlsoap.org/SOAP/Envelope/’> \
               <soapenv:Körper> \
                    <GetListItems Xmlns =’http://Schemas.Microsoft.com/SharePoint/SOAP/’> \
                       <listName>Benutzerdefinierte Liste mit Sub-Ordner</listName> \
                       <viewFields> \
                           <ViewFields> \
                              <FieldRef-Name =' Titel’ /> \
                              <FieldRef-Name ='EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Ordner>http://demoserver1/Blogging Szenarien/Listen/benutzerdefinierte Liste mit Sub-Ordner/Jahr 2006</Ordner> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Körper> \
           </soapenv:Umschlag>";

</Ende>

Onnieren Sie meinen Blog ab.

Folgen Sie mir auf Twitter bei http://www.twitter.com/pagalvin

Endlos Schachteln <div> Markierungen und jQuery

Hinterlasse eine Antwort

Dies scheint, wie so ein Spinner-Thema, Ich bin nicht sicher, dass es wirklich lohnt, über das Bloggen, aber das hat nie aufgehört mich vor, So hier gehen wir Lächeln

Ich bin an einem Projekt arbeiten wo ich einige Daten von einer Suche ziehen bin, Verpackung es bis in eine XML-Nachricht und dann die XML sich letztlich verwandelt in HTML via XSLT. Es gibt eine Menge von jQuery beteiligt, ein wenig davon implementiert einige der Tab-Taste Funktionen. Wenn Sie auf eine Registerkarte klicken (wirklich, eine <div>), jQuery ruft .hide() und ...zum() auf verschiedenen divs (der erste Seite laden lädt alle Inhalte, so gibt es in diesem Fall keine postbacks).

Ein paar Stunden, die Registerkarte Schaltlogik Schritte auffälliges Verhalten und es würde nicht eine meiner Registerkarten zeigen. Ich verfolgt letztlich es bis auf die Tatsache, dass InternetExplorer (mindestens) dachte, dass die <div> Tags geschachtelt weit, weit tiefer als beabsichtigt.Die Developer Toolbar zeigen würde:

-<Div Id = "Tab1Content">
-<div>
    -<div>
      -<Div Id = "Tab2Content">
        -<div>
           …………………………
                   </div> <— endlich zeigt es hier ganz unten geschlossen wurde!

Also, Wenn ich habe ein $("# Tab1Content").Ausblenden(), Ich würde auch Tab2 verstecken und ich könnte nie Tab2 zeigen, wenn ich nicht auch Tab1 zeigen. Ich Kopieren und Einfügen den Code bis in visual Studio und es zeigte alle die Div Futter bis schön, so, wie sie angeblich zu tun, wie folgt aussehen:

-<Div Id = "Tab1Content">
+<div>
+<div>
-<Div Id = "Tab2Content">
+<div>
+<div>

Ich schlug meinen Kopf gegen die Wand für eine Weile und bemerkte, dass in der eigentlichen HTML Code eine Menge von leeren generiert wurde <div> Schlagwörter, wie:

<Körper>

<Div Id = "Tab1Content">

    <Div Id = "row1" />
    <Div Id = "row2" />

</div>

<Div Id = "Tab2Content">

    <Div Id = "row1" />
    <Div Id = "row2" />

</div>

</Körper>

(Das oben genannte ist Waaaaaaaaaaaay vereinfacht. Die leere Div-Tags sind völlig gültig. Einige meiner <div> Markierungen waren voll von Inhalten, aber viel mehr nicht. Ich kam zu der Erkenntnis, dass mein <XSL:für jeden> Richtlinien wurden die Kurzform ausgeben Div-tags wenn die XSL-Datei:für jede nicht ' finden Sie alle Daten. Die Ausgabe einen HTML-Kommentar gezwungen, wie gezeigt:

Nachdem ich den tat, des Div schön aufgereiht und begann meine Tab switching.

Wie immer, Ich hoffe, dass dieses Hilfen im Notfall.

</Ende>

Onnieren Sie meinen Blog ab.

Folgen Sie mir auf Twitter bei http://www.twitter.com/pagalvin

Noch mehr jQuery–Ändern der Größe eines Bild-Beispiel

Hinterlasse eine Antwort

Eine alte Clienthersteller einen Webpart geerbt und es hat ein Imageproblem Größe. Die Bilder sollten 60×50 aber aus irgendeinem Grund, der ursprüngliche Hersteller gezwungen, in 42×42, So suchen sie gequetscht:

Gutes Bild	Schlechtes Image

Hier befindet sich das markup (etwas vereinfacht):

<table Class = "erweitert-Outlook">
<THEAD>
    <TR>
      <Th Breite = 100′>3 Dienstag</Th>
    </TR>
</THEAD>

<TBODY>
    <TR-Klasse = 'Prognose'>
      <td Width = 100′>
        <UL>
          <Li Class = 'hoch'>Hoch: 72&DEG;F</Li>
          <Li Class = "niedriger">Niedrig: 44&DEG;F</Li>
          <Li Class = 'Zustand'>Sonnig
            <Img Src =’http://deskwx.WeatherBug.com/images/Forecast/Icons/Localized/60×50/en/Trans/cond007.png’ Breite = 42’ Höhe = 42’ Alt =” />
          </Li>
        </UL>
      </TD>
    </TR>

</TBODY>

</Tabelle>

Sie werden feststellen, dass obwohl die Pfad zu dem Bild selbst zeigt die richtige dimension (60×50) der ursprüngliche Hersteller gezwungen es 42×42. Warum? Verrückt.

Auf jeden Fall, Ich wollte eine schnelle und einfache Lösung für dieses Problem und ich wandte mich an jQuery. Der Trick bestand darin, alle entsprechenden finden <IMG> Markierungen. Ich wollte nicht mit anderen Img Tags Dreck über (davon gibt es viele). Dieses Bit von jQuery Tat die Tücke:

<Skript-Typ = "Text/Javascript" Src ="http://AJAX.googleapis.com/AJAX/libs/jQuery/1.5/jQuery.Min.js"></Skript>

<Skript-Typ = "Text/Javascript">
     $(Dokument).bereit(Funktion () {

         $(' li.condition > Img').jeder(Funktion (Index, Artikel)
            {
             $(Artikel).CSS("Breite", "60");
             $(Artikel).CSS("Höhe", "50");
            });
     }); // auf Dokument laden
</Skript>

Das Bit des Codes wird die Auflistung <Li> Markierungen, deren Klasse ist "Bedingung" und <IMG> Kinder. Dann durchläuft es all das. Wirkten gefällt ein Anmut.

Ich konnte es wahrscheinlich optimieren, aber ich war nie einer der Unix-Typ, das π gelöst An 18 Ziffern Genauigkeit mit Sed und Awk und ich bin nicht diese Art, wenn jQuery entweder Kerl Lächeln .

</Ende>

Onnieren Sie meinen Blog ab.

Folgen Sie mir auf Twitter bei http://www.twitter.com/pagalvin

Kontrollieren Sie Ihre OK und Abbrechen-Schaltflächen

3 Antworten

Ich schrieb in diesem Artikel eine Weile zurück, aber sieht aus wie ich es von meinem Blog zur Zeit link nicht, so, hier geht:

Dieser Artikel beschreibt wie erzwingen newform.aspx, auf eine Seite umleiten, wenn der Benutzer klickt OK und eine andere Seite, wenn sie "Abbrechen" klickt.

</Ende>

Onnieren Sie meinen Blog ab.

Folgen Sie mir auf Twitter bei http://www.twitter.com/pagalvin

Quick-Tipp: Hinzufügen von jQuery zu MOSS Veröffentlichungsseiten

1 Antwort

Wenn MOSS Publising Seiten mit jQuery verbessern, Ich schlage die folgende Speed bump:

Serverfehler in ' /’ Anwendung.

Parserfehler

Beschreibung: Während der Analyse einer Ressource benötigt, um diese Anforderung ist ein Fehler aufgetreten.. Bitte überprüfen Sie die folgenden Fehlerdetails bestimmte analysieren und ändern Sie die Quelldatei entsprechend.

Parser-Fehlermeldung: Nur Content-Steuerelementen direkt in eine Content-Seite dürfen, die Inhaltssteuerelemente enthält.

Quellstörung:

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

Quelldatei: /_catalogs/masterpage/KCC_FacultyMember.aspx Linie: 12

Versionsinformationen: Microsoft.NET Framework-Version:2.0.50727.4927; ASP.NET-Version:2.0.50727.4927

Es war leicht genug, um zu beheben (h/t an meinen Kollegen, Uday Ethirajulu). Achten Sie darauf, dass der jQuery-Code innerhalb der "PlaceHolderAdditionalPageHead" lebt, wie gezeigt:

<ASP:Inhalt ContentPlaceholderID = "PlaceHolderAdditionalPageHead" Runat = "Server">

<Skript

    Typ = "Text/Javascript"

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

</Skript>

<Skript-Typ = "Text/Javascript">

$(Dokument).bereit(Funktion() {

   // Geniale jQuery Dinge geht hier.

   });

</Skript>

</Ende>

Onnieren Sie meinen Blog ab.

Folgen Sie mir auf Twitter bei http://www.twitter.com/pagalvin