2011-12-19 6 views
0

オーダーフォームの作成を依頼する宿題があります。オーダーフォームには、ユーザーが購入できるアイテムのリストが含まれていると想定されます。これはXML文書に由来し、XSLファイルでスタイルされています。XML - オーダーフォームを作成する

私はこの部分をうまく使い、JavaScriptを使用してHTML DOMにXSLをロードしました。今私はデータをどのように処理するのか把握しようとしています。私は量(ユーザーによって入力される)と価格(XMLから入力される)を掛ける必要があります。

私は完全に固執しており、ここからどこへ行くべきかについてのヒントは非常に高く評価されます。

マイXSLT:

<table width="0" border="1" cellspacing="3" cellpadding="5"> 
    <tr> 
    <td>Qty</td> 
    <td>Item Description</td> 
    <td>Price</td> 
    </tr> 
<xsl:for-each select="//item"> 
    <tr> 
    <td><input name="top" type="text" onchange="calculate()" value="0" size="4" /></td> 
    <td>Item <xsl:value-of select="id"/></td> 
    <td><xsl:value-of select="price"/></td> 
    </tr> 
    </xsl:for-each> 
</table> 

いくつかのXML:数量は、ユーザからあるので

<productcatalog> 

     <item> 
      <id>001</id> 
      <name>Item #1</name> 
      <price>10</price> 
     </item> 
     <item> 
      <id>002</id>    
      <name>Item #2</name> 
      <price>20</price> 
     </item> 
     <item> 
      <id>003</id> 
      <name>Item #3</name> 
      <price>30</price> 
     </item> 
     <item> 
      <id>004</id> 
      <name>Item #4</name> 
      <price>40</price> 
     </item> 



</productcatalog> 

答えて

1

あなたはXSLでこれを実装することはできません。あなたのXSLスタイルシートは計算を行うスクリプトを出力するはずです。

もしあなたがjavascriptライブラリ(例えばjQuery)を使うことができれば、この作業はかなりシンプルですが、これを行なわなくても確実に行うことができます。

あなたの計算機能が必要です。

  1. は数量を格納し、数値に変換します。数量のinput要素がイベントをトリガーします。
  2. 親ノードを歩いてイベントをトリガした行を見つけます。
  3. 戻って歩くことによってその行の価格を見つける。数値に変換します。
  4. 数量で価格を掛け、適切なTDに文字列として挿入します。 (あなたはtextContentまたはinnerText属性を使用します)

価格の格納には問題があります。新しい方法(HTML5で開始)は、接頭辞がの属性を使用することです。価格を入手するのに便利な場所として、data-priceをhtml出力に追加することができます。これを入力ノード自体に置くこともできるので、ノードをナビゲートして価格を見つける必要はありません。

+0

ヒントありがとう、アビラ氏!あなたが気にしないなら、親ノードを上下に歩いて説明してもらえますか?私はそれを少し鮮明に理解し始めていると思う:) –