Tag Archives: XSLT

XSLT at jQuery mga halimbawa

Ako ay paggawa ng maraming ng XSLT at jQuery at naisip gusto kong ibahagi ang ilang mga snippet na ang mga iba ay maaaring kapaki-pakinabang sa hinaharap.

Halimbawa 1: Magbuga simpleng JavaScript / jQuery sa XSLT:

<xsl:template match = "ng isang bagay,,en,script type = "text / javascript",,en,"#QueryFriendlyFilters",,en,"Walang laman",,en,div id = "fdcAllFilters",,en,kung test = "@ Count,,en,span class = "fdcFilterLabel",,en,para-sa-bawat pumili = "UserFilter",,en,isang class = "FilterHref,,en,href = "javascript,,en,'RemoveUserFilter',,en,sulit ng mga piling = "@ FilterValue" /,,en" xml:space="preserve">

  <!– Blangko ang ang query friendly na mga filter nakatagong patlang –>
  <script type="text/javascript">
    $(dokumento).nakahanda(tungkulin(){
      $("#QueryFriendlyFilters").Val("empty");
    });
  </script>

</xsl:template>

Na bit emits ilang JavaScript na naghihintay para sa mga pahina upang tapusin ang loading (dahil sa $(dokumento).nakahanda(...)) at pagkatapos ay nagtatakda ng halaga ng isang nakatagong patlang pinangalanan QueryFriendlyFilters na ang literal na halaga na "walang laman".

Halimbawa 2: Gamitin <xsl:kung> check ang "mas higit",  "Mas mababa", at iba pa.

<xsl:template match = "ng isang bagay,,en,script type = "text / javascript",,en,"#QueryFriendlyFilters",,en,"Walang laman",,en,div id = "fdcAllFilters",,en,kung test = "@ Count,,en,span class = "fdcFilterLabel",,en,para-sa-bawat pumili = "UserFilter",,en,isang class = "FilterHref,,en,href = "javascript,,en,'RemoveUserFilter',,en,sulit ng mga piling = "@ FilterValue" /,,en" xml:space="preserve">

  <div id="fdcAllFilters">
 
    <xsl:if test="@Count>0">
      <span class="fdcFilterLabel">Kasalukuyang filter:</maikling panahon>
    </xsl:kung>

    <!– higit pang mga bagay-bagay ang mangyayari dito. –>

</xsl:template>

Ang itaas na snippet sumusuri upang makita kung ang isang katangian na pinangalanan na "Count" ng element na "bagay" ay mas mataas sa zero.  Ang XML sa likod ng ito ay magiging isang bagay tulad ng:"

<bagay Count = "5" />

Halimbawa 3: Umulit sa pamamagitan ng lahat ng mga elemento, interspersing tawag jQuery.

<!– Umulit sa pamamagitan ng lahat ng mga filter at ipakita ang tamang  mga link. –>
<xsl:for-each select="UserFilter">

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

  <span class="fdcFilterLabel"><xsl:value-of select="@FilterValue"/></maikling panahon>

  <script type="text/javascript">

    $(dokumento).nakahanda(tungkulin(){
        <xsl:teksto><![CDATA[$("#QueryFriendlyFilters").Val( ($("#QueryFriendlyFilters").Val() + " ]]></xsl:teksto>\"<xsl:value-of select="@FilterValue"/>\"<xsl:teksto><![CDATA["));]]></xsl:teksto>
    });

  </script>

</xsl:para sa-bawat>

Ang itaas na snippet ay ang pinaka masalimuot at maaaring may mas madaling paraan upang gawin ito.

Ang XML sa likod na ito ay mukhang halos tulad nito:

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

Snippet na ito ay iterating sa pamamagitan ng <UserFilter> nodes. 

Unang ito emits isang anchor tag na kapag nag-click invokes ng isang function na JavaScript na nasa sa pahina, Sa "mySubmitPage" at magbabalik ang halaga ng isang attribute sa <UserFilter> node na pinangalanang "ID". 

Pagkatapos ito emits ilang jQuery na naghihintay para sa pahina upang i-load.  Na jQuery update ng isang nakatagong mga patlang na pinangalanang "QueryFriendlyFilters" sa pamamagitan ng pagdaragdag ng halaga ng FilterValue ang attribute.  Tandaan ang lahat ng mga nakatutuwang <xsl:teksto> at <![CDATA[ ... ]]> mga bagay.

Iyan na ang lahat, Umaasa ito ay tumutulong sa!

</dulo>

Mag-subscribe sa aking blog.

Sundin ako sa Twitter sa http://www.twitter.com/pagalvin

Endlessly Nesting <div> Tag at jQuery

Ito tila tulad ng isang paksa oddball, Hindi ako sigurado ito ay talagang nagkakahalaga ng pag-blog tungkol sa, ngunit na hindi kailanman tumigil sa akin bago, kaya dito kami pumunta ngiti

Ako nagtatrabaho out sa isang proyekto kung saan ako kumukuha ng ilang mga data mula sa isang paghahanap, packaging up ito sa isang XML mensahe at pagkatapos ay na XML sa huli ay transformed sa HTML sa pamamagitan ng XSLT.  Mayroong maraming mga jQuery kasangkot, isa bit na kung saan ipinapatupad ng ilang mga pag-andar tabbing.  Kapag nag-click ka sa isang tab (talaga, isang <div>), jQuery invokes. itago() at. palabas() sa iba't-ibang mga divs (ang paunang pag-load ng pahina Dina-download ang lahat ng mga nilalaman sa gayon walang mga postbacks sa kasong ito).

Ang isang grupo ng mga oras ang nakalipas, ang tab paglipat logic nagsimulang kumilos erratically at hindi ito ay magpapakita ng isa sa aking mga tab.  Ako sa huli sinubaybayan ito pababa sa ang katunayan na ang internet explorer (kahit) naisip na ang <div> mga tag nested malayo, malayo mas malalim kaysa intended.The developer toolbar ay magpapakita ng:

-<div id = "Tab1Content">
  -<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           ..............................
                   </div>  <-Sa wakas ay nagpapakita ng ito ay sarado ang lahat ng paraan ang down dito!

Kaya, kung ginawa ko ang isang $("# Tab1Content").itago(), Gusto ko ring itago Tab2 at hindi ko maaaring magpakita Tab2 kung hindi ko ring ipakita Tab1.  Ako kopyahin at ilagay ang code hanggang sa visual studio at ito ay nagpakita ng lahat ng lining ang div up ni mabuti, tulad lang nila na ipagpalagay na paggawa, naghahanap ng ganito:

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

Matalo ko ang aking ulo laban sa mga pader para sa isang habang at napansin na sa aktwal na code ng HTML ay bumubuo ng maraming laman <div> mga tag, katulad:

<katawan>

  <div id = "Tab1Content">

    <div id = "ROW1" />
    <div id = "ROW2" />

  </div>

  <div id = "Tab2Content">

    <div id = "ROW1" />
    <div id = "ROW2" />

  </div>

</katawan>

(Sa itaas ay waaaaaaaaaaaay oversimplified.  Ang walang laman div tag ay lubos wastong. Ang ilan sa aking <div> mga tag ay puno ng mga nilalaman, ngunit marami pa ay hindi.  Ako ay dumating sa pagtanto na ang aking <xsl:para sa-bawat> mga kautusan ay nagpapalabas ng mga short-form na tag div kapag ang xsl:para-sa-bawat ay hindi 'makahanap ng anumang data.  Pinilit ako ng isang HTML komento sa output, tulad ng ipinapakita:

image

 

Pagkatapos kong gumawa niyan, lahat ng div ay ang naka-linya up mabuti at ang aking tab Paglipat nagsimula nagtatrabaho.

Tulad ng nakasanayan, Umaasa ako na ito ay tumutulong sa isang tao sa isang pakurot.

</dulo>

Mag-subscribe sa aking blog.

Sundin ako sa Twitter sa http://www.twitter.com/pagalvin

Halimbawa: Ng XSLT Paglikha ng HTML href ng

Ko na ay paggawa ng isang bit ng XSL bagay-bagay kani-kanina lamang at naisip Gusto ko magkasama ng isang sample para sa aking hinaharap reference at na maaaring ng halaga sa lahat sa atin XSLT-ers paggawa ng isang buhay sa internets.

Isaalang-alang ang mga sumusunod na XML:

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

Ang mga sumusunod na snippet XSL ay bumuo ng isang pinagsunod-sunod na listahan ng mga tab sa HREF:

<xsl:template match="FdcSearchTabsCollection" xml:space="preserve">
   
    <!– The "all" tab –>
    <a href="javascript:ViewTab(‘All’)">Tingnan ang lahat ng</isang>
   
    <!– Bawat indibidwal na tab –>
    <!– Umulit sa pamamagitan ng lahat ng mga tab at ipakita ang tamang  mga link. –>
    <xsl:for-each select="SearchTab">
      <xsl:sort select="@SortOrder"/>

      …
      <a href="javascript:ViewTab('{@ TabID}')"><xsl:value-of select="@Label"/></isang>
    </xsl:para sa-bawat>

    <br /> 
   

   </xsl:template>

Narito ang kung ano ang tila sa SharePoint:

SNAGHTML78aa2cb

 

 

</dulo>

Mag-subscribe sa aking blog.

Sundin ako sa Twitter sa http://www.twitter.com/pagalvin