Tag Archives: jQuery

XSLT a jQuery vzorky

Som bol robí veľa XSLT a jQuery a myslel som zdieľať niekoľko úryvkov, ktoré iní môžu nájsť užitočné v budúcnosti.

Príklad 1: Vyžarovanie jednoduchý JavaScript / jQuery v XSLT:

<XSL:Šablóna zápas = "niečo" XML:priestor = "zachovanie">

<!– Prázdne, skryté pole priateľské filtre dotaz –>
<skript typ = "text/javascript">
    $(dokument).pripravený(Funkcia(){
      $("#QueryFriendlyFilters").Val("empty");
    });
</skript>

</XSL:šablóny>

Tom trochu emituje niektoré JavaScript, ktorý čaká na načítanie stránky (z dôvodu $(dokument).pripravený(…)) a potom nastaví hodnota skryté pole s názvom QueryFriendlyFilters na Literálová hodnota "empty".

Príklad 2: Použitie <XSL:Ak> skontrolovať "väčší ako", "menší ako", atď.

<XSL:Šablóna zápas = "niečo" XML:priestor = "zachovanie">

<div id = "fdcAllFilters">

    <XSL:Ak test="@Count>0">
      <span triedy = "fdcFilterLabel">Aktuálne filtre:</span>
    </XSL:Ak>

    <!– viac vecí sa deje tu. –>

</XSL:šablóny>

Vyššie úryvok skontroluje, ak atribút s názvom "Count" prvku "niečo" je väčšia ako nula. XML za to by bolo niečo:”

<niečo počet = "5" />

Príklad 3: Iterácia súboru cez všetky prvky, interspersing jQuery hovory.

<!– Iterácia súboru cez všetky filtre a zobraziť správne odkazy. –>
<XSL:pre každý výber = "UserFilter">

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

<span triedy = "fdcFilterLabel"><XSL:hodnoty z select="@FilterValue"/></span>

<skript typ = "text/javascript">

    $(dokument).pripravený(Funkcia(){
        <XSL:text><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></XSL:text>\"<XSL:hodnoty z select="@FilterValue"/>\"<XSL:text><![CDATA["));]]></XSL:text>
    });

</skript>

</XSL:pre každý>

Vyššie úryvok je najkomplexnejšie a môže byť jednoduchšie spôsoby, ako na to.

XML za to vyzerá približne takto:

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

Tento úryvok je Iterácia prostredníctvom <UserFilter> uzly.

Najprv emituje kotva tag, ktoré po kliknutí vyvolá funkciu JavaScript, ktorý je už na stránke, "mySubmitPage" a odovzdáva hodnotu atribútu <UserFilter> uzol, s názvom "Identifikácia".

Potom emituje niektoré jQuery, ktorý čaká na stránku načítať. Že jQuery aktualizuje skryté pole s názvom "QueryFriendlyFilters" pridaním hodnota atribútu FilterValue. Poznámka všetky crazy <XSL:text> a <![CDATA[ … ]]> veci.

To je všetko, Dúfam, že pomôže!

</koniec>

Vyberajte môj blog.

Nasledujte ma na stebėtų na http://www.twitter.com/pagalvin

Lists.asmx, GetListItems a priečinkov

6 odpovede

Bol som robiť nejaké výskum pre niekoho dnes okolo list.asmx webovej služby poskytované ako súčasť SharePoint 2010 (a staršie). Ona sa podarilo získať zoznam položiek v hlavnom priečinku (vrátane názvov podpriečinkov), ale nemohol dostať položky v podpriečinkov. Som urobil niektoré pozrieme na internetové a je prekvapivo spoločná otázka. Ešte, Nemohol som sa dostať dobrú odpoveď na jednoduchú otázku, „pokiaľ viem, aby sa priečinok, ako sa dostať položky v priečinku?” Ak chcete byť úprimný, Aj vyskúšať tvrdo všetko, pretože som chcel obrázok, tohle sa sám na chvíľu úsmev .

Nastavenie, Som vytvoril stránky s názvom "Blogovanie scenáre" a vlastný zoznam s názvom "Vlastný zoznam s Sub Folders". Potom som vytvoril priečinky s názvom:

Rok 2005
Rok 2006
Rok 2007

Som pridal niekoľko položiek do priečinka „rok 2006". To je to, čo vyzerá ako:

Môj priateľ nie je písania kódu C#, ale skôr pomocou Java, Obálka SOAP tak bol, čo ona naozaj potrebné. Tú, Som napísal bitovým jQuery a potom použiť fiddler získať skutočný rozhovor HTTP.

Tu je relevantné jQuery (I skopíroval kód nadol pod Ak chcete kopírovať/vložiť):

Ich prvý kľúč je zahrnúť aj <queryOptions> a <QueryOptions> uzol. Druhý kľúč je, že <Priečinok> uzol je URL, na ktorú má klient prístup.

Môžu existovať iné spôsoby, ako si to, ale to funguje dobre pre mňa, keď pomocou jQuery.

Tu je Obálka SOAP pre vyššie uvedené:

<soapenv:Obálka xmlns:soapenv =’http://schemas.xmlsoap.org/SOAP/Envelope/’>
<soapenv:Orgán>
    <GetListItems xmlns =’http://schemas.Microsoft.com/SharePoint/SOAP/’>
      <listnate>Vlastný zoznam s priečinkami Sub</listnate>
      <viewFields>
        <ViewFields>
          <Názov FieldRef = "hlava’ />
          <Názov FieldRef = "EncodedAbsUrl’ />
        </ViewFields>
      </viewFields>
      <queryOptions>
        <QueryOptions>
          <Priečinok>http://demoserver1/blogovanie Scenáre, zoznamy alebo vlastné zoznam s Sub Folders za rok 2006</Priečinok>
        </QueryOptions>
      </queryOptions>
    </GetListItems>
</soapenv:Orgán>
</soapenv:Obálka>

Veľa príkladov a diskusie okolo to viedol ma domnievať sa, že všetko, čo potrebujete bol <QueryOptions> a zadajte názov priečinka. Pre mňa, I potrebné pre obe zabaliť vnútri <queryOptions> rovnako ako zadajte úplnú adresu URL <Priečinok> uzol.

Tu je nastavenie AJAX jQuery:

$(dokument).pripravený(Funkcia() {
       var soapEnv =
           "<soapenv:Obálka xmlns:soapenv =’http://schemas.xmlsoap.org/SOAP/Envelope/’> \
               <soapenv:Orgán> \
                    <GetListItems xmlns =’http://schemas.Microsoft.com/SharePoint/SOAP/’> \
                       <listnate>Vlastný zoznam s priečinkami Sub</listnate> \
                       <viewFields> \
                           <ViewFields> \
                              <Názov FieldRef = "hlava’ /> \
                              <Názov FieldRef = "EncodedAbsUrl’ /> \
                          </ViewFields> \
                       </viewFields> \
                       <queryOptions> \
                         <QueryOptions> \
                           <Priečinok>http://demoserver1/Blogging Scenáre, zoznamy alebo vlastné zoznam s Sub Folders za rok 2006</Priečinok> \
                         </QueryOptions> \
                       </queryOptions> \
                   </GetListItems> \
               </soapenv:Orgán> \
           </soapenv:Obálka>";

</koniec>

Vyberajte môj blog.

Nasledujte ma na stebėtų na http://www.twitter.com/pagalvin

Donekonečna vnorenia <DIV> Značky a jQuery

Zanechať Odpoveď

To sa zdá ako také podivín tému, Nie som si istý, je to naozaj stojí za blogovanie o, ale že nebol nikdy zastavený ma pred, tak tady úsmev

Som pracovať na projekt, kde I 'm ťahanie niektoré údaje z vyhľadávania, balenie je do XML správ a potom že XML sa nakoniec premení HTML pomocou XSLT. Existuje veľa jQuery, jeden bit, ktorý implementuje niektoré tabování funkcie. Keď kliknete na kartu (naozaj, a <DIV>), jQuery vyvolá .hide() a .show() na rôznych divs (úvodnú stránku zaťaženie prevezme všetky obsah, takže neexistujú žiadne spätných odoslaní v tomto prípade).

Pár hodín pred, kartu prepínanie logika začali správať nevyspytateľne a to by ukázať jednu z mojich záložiek. Nakoniec sledoval som to tým, že program internet explorer (aspoň) myslel, že <DIV> Tagy vnorené ďaleko, oveľa hlbšie, než sa plánovalo.Paneli nástrojov vývojára by Ukázať:

-<div id = "Tab1Content">
-<DIV>
    -<DIV>
      -<div id = "Tab2Content">
        -<DIV>
           …………………………
                   </DIV> <— konečne ukazuje, že bola uzavretá celú cestu dole tu!

Takže, Ak som to urobil $("#Tab1Content").Skryť(), By tiež skryť 2 a nikdy by mohla ukázať 2 Ak nemal tiež ukazujú Tab1. Skopírovať a vložiť kód do visual studio a to ukázal všetky div obloženia sa pekne, rovnako ako oni mali robiť, Hľadáte takhle:

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

Biť hlavou o stenu na chvíľu a všimol si, že v skutočnej HTML kód bol vytvára veľa prázdnych <DIV> Tagy, ako:

<telo>

<div id = "Tab1Content">

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

</DIV>

<div id = "Tab2Content">

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

</DIV>

</telo>

(Vyššie uvedené je waaaaaaaaaaaay nedbalo. Prázdny div tagy sú úplne platné. Niektoré z mojich <DIV> Tagy boli plné obsahu, ale mnoho ďalších neboli. Prišiel som k poznaniu, že moja <XSL:pre každý> smernice boli vyžarujúce krátky div Tagy kedy xsl:pre každú nemali "nájsť žiadne údaje. Som nútený do výstupného HTML komentár, ako je uvedené:

Potom, čo som to urobil, všetky div postavili pekne a môj kartu prepínanie začal pracovať.

Ako vždy, Dúfam, že to pomôže niekto v núdzi.

</koniec>

Vyberajte môj blog.

Nasledujte ma na stebėtų na http://www.twitter.com/pagalvin

Ešte viac jQuery–Ak chcete zmeniť veľkosť príklad obrázka

Zanechať Odpoveď

Som zdedil webovú časť od klienta stará dodávateľa a má obraz veľkosti problém. Obrázky by mali byť 60×50 ale z nejakého zvláštneho dôvodu, pôvodný dodávateľ nútený do 42×42, tak vyzerajú rozmliaždeniu:

Dobrý obraz	Zlý obraz

Tu je značky (trochu zjednodušené):

<Tabuľka class = "Rozšírená-outlook">
<thead>
    <TR>
      <th šírka = 100′>3 Utorok</th>
    </TR>
</thead>

<TBODY>
    <TR class = "predpoveď">
      <TD šírka = 100′>
        <ul>
          <li class = "vysoká">Vysoká: 72°F</li>
          <li triedy = "nízke">Nízka: 44°F</li>
          <li triedy = "stav">Slnečný
            <img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/EN/trans/cond007.png’ Šírka = "42’ Výška = "42’ ALT =” />
          </li>
        </ul>
      </TD>
    </TR>

</TBODY>

</Tabuľka>

Všimnite si, že aj keď cestu k samotnému obrázku ukazuje správny rozmer (60×50) pôvodný dodávateľ nútený 42×42. prečo? bláznivý.

Každopádne, Chcel som rýchle a jednoduché riešenie tohto problému a obrátil som sa na jQuery. Trik bol na vyhľadanie všetkých vhodných <IMG> Tagy. Nechcel som muck asi s inými img Tagy (ktoré existuje veľa). Tento bit jQuery urobil trik:

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

<skript typ = "text/javascript">
     $(dokument).pripravený(Funkcia () {

         $("li.condition > img ").každý(Funkcia (index, položka)
            {
             $(položka).CSS("Šírka", "60");
             $(položka).CSS("výška", "50");
            });
     }); // na dokument zaťaženie
</skript>

Že trochu kódexu zistí kolekcia <li> Tagy ktorého trieda je "stav" a <IMG> deti. Potom vykonáva iterácie, cez to všetko. Pracoval ako kúzlo.

Pravdepodobne by mohla zjednodušenie je, ale nikdy som bol druh unix chlap, ktorý vyriešil π na 18 číslice presnosť použitia sed a awk a já nejsem tohto druhu, ak buď chlap jQuery úsmev .

</koniec>

Vyberajte môj blog.

Nasledujte ma na stebėtų na http://www.twitter.com/pagalvin

Prevziať kontrolu nad vašej OK a zrušiť tlačidlá

3 odpovede

Napísal som Tento článok chvíľu späť, ale vyzerá to, že nemal odkaz na to z môjho blogu v čase, Takže tu ide:

Tento článok popisuje prinútiť newform.aspx presmerovať na jednej stránke, keď používateľ klikne na tlačidlo OK a inej stránke keď ona kliknutí zrušiť.

</koniec>

Vyberajte môj blog.

Nasledujte ma na stebėtų na http://www.twitter.com/pagalvin

Rýchly Tip: Pridanie jQuery MOSS publikačné stránky

1 Odpoveď

Pri podpore chodeniu MOSS publising stránok pomocou jQuery, Hit nasledujúcej speed bump:

Server chyba "/’ Uplatňovanie.

Analyzátor chyba

Popis: Vyskytla sa chyba počas parsování prostriedok potrebnou na servis túto požiadavku. Prosím skontrolujte nasledovné špecifické Syntaktická chyba podrobnosti a primerane upraviť zdrojový súbor.

Analyzátor chybové hlásenie: Obsahové ovládacie prvky sú povolené len priamo v obsahu stránky, ktorý obsahuje obsahové ovládacie prvky.

Zdroj chyby:

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

Zdrojový súbor: /_catalogs/masterpage/KCC_FacultyMember.aspx Riadok: 12

Informácie o verzii: Microsoft.NET Framework, verzia:2.0.50727.4927; ASP.NET verzie:2.0.50727.4927

Bolo to dosť jednoduché opraviť (h/t na môj kolega, Uday Ethirajulu). Uistite sa, že jQuery kód žije vnútri "PlaceHolderAdditionalPageHead", ako je uvedené:

<ASP:Obsah ContentPlaceholderID = "PlaceHolderAdditionalPageHead" HTML runat = "server">

<skript

    type = text/javascript""

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

</skript>

<skript typ = "text/javascript">

$(dokument).pripravený(Funkcia() {

   // Brilantné jQuery veci ide tu..

   });

</skript>

</koniec>

Vyberajte môj blog.

Nasledujte ma na stebėtų na http://www.twitter.com/pagalvin