Arkivat e Kategorisë: XSLT

XSLT dhe Mostrat jQuery

Unë kam qenë duke bërë një shumë e XSLT dhe jQuery dhe mendova se do të ndajnë disa copra pak se të tjerët mund të gjeni të dobishme në të ardhmen.

Shembull 1: Lëshojnë JavaScript thjeshtë / jQuery në XSLT:

<XSL:template match="something" xml:space="preserve">

<!– Bosh jashtë query miqësore fushë filtra fshehur –>
<script type="text/javascript">
    $(dokument).gati(funksion(){
      $("#QueryFriendlyFilters").val("empty");
    });
</dorëshkrim>

</XSL:shabllon>

Kjo pak lëshon disa JavaScript që pret për faqe për të përfunduar ngarkimit (për shkak të $(dokument).gati(...)) dhe pastaj përcakton vlerën e një fushë të fshehur emrin QueryFriendlyFilters me vlerën literal "bosh".

Shembull 2: Përdorim <XSL:nëse> për të kontrolluar "e madhe se", "Më pak se", etj.

<XSL:template match="something" xml:space="preserve">

<div id="fdcAllFilters">

    <XSL:if test="@Count>0">
      <span class="fdcFilterLabel">Filtra aktuale:</hapësirë>
    </XSL:nëse>

    <!– shumë gjëra që ndodh këtu. –>

</XSL:shabllon>

Snippet më sipër kontrollon për të parë nëse një atribut i quajtur "Count" e elementit "diçka" është më i madh se zero. XML prapa kjo do të jetë diçka si:"

<diçka Count = "5" />

Shembull 3: Iterate nëpër të gjitha elementet, interspersing thirrje jQuery.

<!– Iterate nëpër të gjitha filtrat dhe të shfaqin saktë Lidhje. –>
<XSL:for-each select="UserFilter">

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

<span class="fdcFilterLabel"><XSL:value-of select="@FilterValue"/></hapësirë>

<script type="text/javascript">

    $(dokument).gati(funksion(){
        <XSL:tekst><![CDATA[$("#QueryFriendlyFilters").val( ($("#QueryFriendlyFilters").val() + " ]]></XSL:tekst>\"<XSL:value-of select="@FilterValue"/>\"<XSL:tekst><![CDATA["));]]></XSL:tekst>
    });

</dorëshkrim>

</XSL:për njëri->

Snippet e mësipërme është më komplekse dhe nuk mund të jetë mënyra më e lehtë për ta bërë atë.

XML prapa kjo duket afërsisht si kjo:

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

Kjo snippet është iterating përmes <UserFilter> nyjet.

Ajo i parë lëshon një tag spirancë se kur klikohet thirret një funksion JavaScript që është tashmë në faqen, "MySubmitPage" dhe kalon vlerën e një atribut në <UserFilter> Nyja e quajtur "ID".

Ajo pastaj lëshon disa jQuery që pret për faqe të ngarkesës. Kjo jQuery përditësime një fushë fshehur quajtur "QueryFriendlyFilters" duke shtuar vlerën e atribut FilterValue. Vini re të gjitha çmendur <XSL:tekst> dhe <![CDATA[ ... ]]> sende.

Kjo është ajo, shpresoj se kjo ndihmon!

</fund>

Abonohen në blogun tim.

Atëherë ejani pas meje në Twitter në http://www.twitter.com/pagalvin

Pafund Folezojnë <div> Tags dhe jQuery

Lini një përgjigje

Kjo duket si një temë e tillë oddball, Unë nuk jam i sigurt se kjo është me të vërtetë me vlerë rreth Blogging, por që kurrë nuk është ndalur mua para, kështu që këtu ne do të shkojmë buzëqeshje

Unë jam duke punuar në një projekt ku unë jam tërhequr disa të dhëna nga një kërkim, paketimin atë deri në një mesazh XML dhe pastaj se XML është transformuar përfundimisht në HTML me anë XSLT. Nuk është një shumë e jQuery përfshirë, një grimë e cila zbaton disa funksionalitetin tastit tab. Kur ju klikoni mbi një tab (vërtet, një <div>), jQuery invokes. fshehin() dhe. show() on divs ndryshme (ngarkesa fillestare faqe shkarkon të gjithë përmbajtjen kështu që nuk ka postbacks në këtë rast).

Një bandë e orë më parë, logjika tab kalimi filluar të sillen erratically dhe ajo nuk do të tregojë një prej tabs mi. Unë përfundimisht gjurmuar atë poshtë për faktin se internet explorer (të paktën) mendonin se <div> tags mbivendosur tani, shumë më të thellë se Developer Toolbar intended.The do të tregojë:

-<div id = "Tab1Content">
-<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           ..............................
                   </div> <-Më në fund duke treguar ajo ishte e mbyllur të gjithë rrugën poshtë këtu!

Kështu, në qoftë se kam bërë një $("# Tab1Content").fsheh(), Unë do të fsheh Tab2 dhe unë kurrë nuk mund të tregojë Tab2 në qoftë se unë nuk e tregojnë gjithashtu Tab1. I kopjuar dhe ngjit kodin e deri në studio vizuale dhe ajo i tregoi të gjitha rreshtim DIV-së deri bukur, ashtu si ata ishin menduar të jetë bërë, në kërkim si kjo:

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

I rrahur kokën time kundër murit për një kohë dhe të vënë re se në kodin aktual HTML është gjeneruar një shumë të zbrazët <div> tags, si:

<trup>

<div id = "Tab1Content">

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

</div>

<div id = "Tab2Content">

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

</div>

</trup>

(Sipër është waaaaaaaaaaaay thjeshtëzuar. Tags boshe div janë krejtësisht të vlefshme. Disa nga tim <div> tags ishin plot e përmbajtjes, por shumë më tepër nuk ishin. Unë kam ardhur në realizimin se im <XSL:për njëri-> Direktivat janë emitting-shkurtra formë tags div kur XSL:për njëri-nuk 'gjejnë ndonjë të dhënave. I detyruar një koment HTML në dalje, siç tregohet:

Pasi unë e bëri atë, div të gjitha është rreshtuar bukur dhe switching im tab filluar pune.

Si gjithmonë, Unë shpresoj se kjo ndihmon dikush në një majë.

</fund>

Abonohen në blogun tim.

Atëherë ejani pas meje në Twitter në http://www.twitter.com/pagalvin

Shembull: XSLT Krijimi href HTML-së

1 Përgjigje

Unë kam qenë duke bërë një grimë e gjëra XSL kohët e fundit dhe mendova se do të vënë së bashku një mostër për referencë time të ardhshme dhe se mund të jetë me vlerë për të gjithë ne XSLT-këndvështrimi bërë një jetesë në internets.

Konsideroni e mëposhtme XML:

<FdcSearchTabsCollection Count="2">
<SearchTab Label="Industry" SortOrder=”00” Label=”Industries” SearchConstraints="contenttype:Industri" TabID="831b2a74-98c4-4453-8061-86e2fdb22c63"/>
<SearchTab Label="Practices" SortOrder=”01” Label=”Practices” SearchConstraints="contenttype:PracticeGroups" TabID="678e206b-6996-421f-9765-b0558fe1a9c0"/>
</FdcSearchTabsCollection>

The following XSL snippet will generate a sorted list of hrefs tabs:

<XSL:template match="FdcSearchTabsCollection" xml:space="preserve">

    <!– The "all" tab –>
    <a href="javascript:ViewTab(‘All’)">View all</një>

    <!– Each individual tab –>
    <!– Iterate through all the Tabs and display the correct Lidhje. –>
    <XSL:for-each select="SearchTab">
      <XSL:sort select="@SortOrder"/>

      …
      <a href="javascript:ViewTab('{@TabID}')"><XSL:value-of select="@Label"/></një>
    </XSL:për njëri->

    <br/>


   </XSL:shabllon>

Here’s what it looks like in SharePoint:

</fund>

Abonohen në blogun tim.

Atëherë ejani pas meje në Twitter në http://www.twitter.com/pagalvin