タグのアーカイブ: XSLT

XSLT と jQuery をサンプルします。

XSLT と jQuery と他の将来の役に立つことがありますいくつかのスニペットを共有するだろうと思ったの多くをしています。.

例 1: 簡単な JavaScript を出力します。 / XSLT で jQuery:

<xsl:テンプレート照合」何か =" xml:空間 ="preserve">

  <!– 空白クエリ フレンドリー フィルターの非表示フィールド –>
  <スクリプトの種類」テキスト/javascript」=>
    $(ドキュメント).準備ができて(関数(){
      $(「#QueryFriendlyFilters」).ヴァル(「空」);
    });
  </スクリプト>

</xsl:テンプレート>

ページの読み込みが完了するまで待機する JavaScript は、ビットを出力します。 (ため、 $(ドキュメント).準備ができて(…)) [名前セットを非表示フィールドの値 QueryFriendlyFilters をリテラル値に「空」.

例 2: 使用 <xsl:場合> 「より大きい」をチェックするには,  「より小さい」, など.

<xsl:テンプレート照合」何か =" xml:空間 ="preserve">

  <div id ="fdcAllFilters">
 
    <xsl:場合 test="@Count>0">
      <クラスにまたがる「fdcFilterLabel」=>現在のフィルター:</スパン>
    </xsl:場合>

    <!– 多くの原料をここに起こる. –>

</xsl:テンプレート>

上記のスニペット」、「何か」の要素のカウント」という名前属性が 0 より大きいどうかを確認します。  この背後にある XML のようなものになります。:”

<何かカウント =「5」/>

例 3: すべての要素を反復処理します。, jQuery の呼び出しを interspersing.

<!– すべてのフィルターを反復処理し、正しい表示  リンク. –>
<xsl:各選択 =「UserFilter」>

  <クラス「FilterHref =" href ="javascript:mySubmitPage(' RemoveUserFilter','{@ ID}’)">[X]</は>

  <クラスにまたがる「fdcFilterLabel」=><xsl:値の select="@FilterValue"/></スパン>

  <スクリプトの種類」テキスト/javascript」=>

    $(ドキュメント).準備ができて(関数(){
        <xsl:本文><![CDATA[$(「#QueryFriendlyFilters」).ヴァル( ($(「#QueryFriendlyFilters」).ヴァル() + " ]]></xsl:本文>\"<xsl:値の select="@FilterValue"/>\"<xsl:本文><![CDATA["));]]></xsl:本文>
    });

  </スクリプト>

</xsl:それぞれ>

上記のコードは最も複雑なですし、それをする簡単な方法がある可能性があります。.

この背後にある XML 大体次のように見える:

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

このスニペットを反復します。 <UserFilter> ノード。 

それを最初のアンカー出力をクリックするとタグ、ページに既に存在する JavaScript 関数を呼び出す, 「mySubmitPage」と、属性の値を渡すは <UserFilter> "ID"という名前のノード。 

[ページの読み込みに待機するいくつかの jQuery を出力します。  その jQuery FilterValue 属性の値を追加することによって「QueryFriendlyFilters」という名前は非表示のフィールドを更新します。  メモすべての狂気 <xsl:本文> と <![CDATA[ … ]]> もの.

それは, それに役立ちます願っています!

</終了>

私のブログを購読します。.

私は Twitter の上に従ってください。 http://www.twitter.com/pagalvin

無限のネスト <div> タグと jQuery

これは、ようなのような型破りなトピックです。, 私はそれは本当にについてのブログの価値があるか分からない, しかし、決して私の前に停止しています。, だからここに行く スマイル

私はここで私はいくつかのデータの検索から引っ張ってプロジェクトに取り組んでいます。, パッケージ XML メッセージにし、XML は、最終的に XSLT で HTML に変換されます。  たくさんある jQuery の関与, 1 つのビットはいくつかのタブ機能を実装します。  上のタブをクリックすると (本当に, は <div>), jQuery の .hide を呼び出す() .show() さまざまな div に (ポストバックがないのでこの場合、最初のページのロードのすべてのコンテンツをダウンロードします。).

前の束, 動作が不安定にロジックを切り替えタブを開始し、それは私のタブのいずれかを表示されません。  私は最終的には、実際には、インターネット エクスプ ローラーを追跡 (少なくとも) 考え、 <div> これまで入れ子になったタグ, 意図したよりもはるかに深い。[開発者用] ツールバーを表示します。:

-<div id ="Tab1Content">
  -<div>
    -<div>
      -<div id ="Tab2Content">
        -<div>
           …………………………
                   </div>  <— 最後にそれを表示では、ここにすべての方法を閉鎖されました。!

だから, か、 $(「# Tab1Content」).非表示します。(), 私はまた Tab2 を隠すだろうし、私は私がまた Tab1 を示さなかったかどうか Tab2 を見ることが。  コピーし、visual studio と、すべての div の裏地をうまく示したにコードを貼り付け, 同じように彼らのことになっていた, このような:

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

私はしばらくの間の壁に対して私の頭を打つし、実際の HTML の多くの空のコードを生成していたことに気づいた <div> タグ, ような:

<体>

  <div id ="Tab1Content">

    <div id」row1」=/>
    <div id」[row2」=/>

  </div>

  <div id ="Tab2Content">

    <div id」row1」=/>
    <div id」[row2」=/>

  </div>

</体>

(上記の単純にしすぎ waaaaaaaaaaaay です。  空の div タグが完全に有効であります。. いくつかの私 <div> タグの内容でした。, しかし、多くはなかった。  私は実現に来た、私 <xsl:それぞれ> ディレクティブは、短い形式が発光された div タグと xsl:各 didn't ' のデータを見つけます。  私は、出力に、HTML コメントを強制, 示すように:

image

 

私はそれをした後, すべての div がきれいに並んで、私のタブの切り替え作業開始.

いつものように, これはピンチで誰かに役立ちます願っています.

</終了>

私のブログを購読します。.

私は Twitter の上に従ってください。 http://www.twitter.com/pagalvin

例: XSLT の作成 HTML の Href

最近 XSL 原料のビットをやっているしては、サンプル私の将来の参考のため一緒と XSLT ers、インターネットで生計を立てて値を私たちのすべてのこと.

次の xml します。:

<FdcSearchTabsCollection カウント =「2」>
  <SearchTab ラベル ="産業" SortOrder =「00」ラベル「産業」SearchConstraints ="contenttype を =:業界" 癆性 ="831b2a74-98c4-4453-8061-86e2fdb22c63"/>
  <SearchTab ラベル"プラクティスを =" SortOrder =「01」ラベル「プラクティス」SearchConstraints ="contenttype を =:PracticeGroups" TabID"678e206b-6996-421f-9765-b0558fe1a9c0"=/>
</FdcSearchTabsCollection>

次の XSL スニペット href のタブの並べ替えられたリストが生成されます。:

<xsl:テンプレートの match ="FdcSearchTabsCollection" xml:空間 ="preserve">
   
    <!– "すべて" タブ –>
    <a href = javascript」:タブ('すべて')">すべてを見る</は>
   
    <!– それぞれの個々 のタブ –>
    <!– すべてのタブを反復処理し、正しい表示  リンク. –>
    <xsl:それぞれの select ="SearchTab">
      <xsl:並べ替え select="@SortOrder"/>

      …
      <a href = javascript」:タブ(‘{@TabID}’)"><xsl:値の select="@Label"/></は>
    </xsl:それぞれ>

    <br/> 
   

   </xsl:テンプレート>

ここでは、SharePoint でどのように見えるか:

SNAGHTML78aa2cb

 

 

</終了>

私のブログを購読します。.

私は Twitter の上に従ってください。 http://www.twitter.com/pagalvin