CodeZine(コードジン)

特集ページ一覧

Expression WebでXMLデータを挿入してみよう

XMLファイルを利用したWebページ作成とRSSフィードの挿入

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2007/11/21 14:00
目次

データビューのレイアウトの変更

 Expression Webで用意されているHTMLビューのスタイルは、表形式、帳簿形式、カンマ区切り、タイトルリスト、タイトルメニュー(ドロップダウン)スタイルなど、16種類あります。まず表形式でデータビューが挿入されますが、そのデータビューのレイアウトを変更する方法を紹介します。

  1. [コモン Data View タスク]の[レイアウトの変更]をクリックします。
     
     
  2. [データビューのプロパティ]ダイアログボックスの[レイアウト]タブが開かれました。HTMLビューのスタイルを一覧から選択し、[OK]ボタンをクリックします。
     

画像としてフィールドを挿入する

 このXMLデータには、画像フィールドも含まれています。通常、データビューを挿入するとそのファイルへのパス情報がテキストで表示されますが、これを画像に表示を変更する方法を紹介します。

  1. 作業中のWebページをサンプルXMLファイル(book.xml)と同じ場所に保存します。
     
  2. [埋め込みファイルの保存]ダイアログボックスが表示され、[OK]ボタンをクリックすることで、XSLファイルと「xslview.js」が保存されます。
     
     
  3. 画像ファイルへのパスのテキストを削除すると、他のすべてのデータの同じフィールドも同時に削除されます。
     
     
  4. データソースの詳細作業ウィンドウの一覧から、[image]を右クリックして、[画像として挿入]をクリックします。
     
     
  5. 確認メッセージが表示されるので、[はい]ボタンをクリックします。
     
     
  6. フィールドが画像として挿入されました。
     

データビューのフィルタ設定

 フィルタで、データビューに表示するリストアイテムを絞り込むことができます。フィルタ条件の指定は、[コモン Data View タスク]で[フィルタ]をクリックすると表示される[フィルタ条件]ダイアログボックスで行います。なお、フィルタの条件はグループ化したり、XPath式による詳細な条件を指定したりすることも可能です。

  1. [コモン Data View タスク]で[フィルタ]をクリックします。
     
     
  2. [フィルタ条件]ダイアログボックスが表示されました。「新しい条件節を追加するにはここをクリックします...」の部分をクリックします。
     
     
  3. [フィールド名][条件式][値]を指定していきます。ここでは、[フィールド名]を「book」、[条件式]には「次の値を含む」、[値」には「困った」を入力して、[OK]ボタンをクリックします。
     
     
  4. 条件に一致するものだけが表示されました。
     
フィルタを解除するには
 [コモン Data View タスク]で[フィルタ]をクリックして[フィルタ条件]ダイアログボックスを表示し、指定されたフィルタの条件の行を選択して[Delete]キーを押します。
 
条件の詳細設定
 [フィルタ条件]ダイアログボックスの右下の[詳細設定]ボタンをクリックすると、下の図のように[条件の詳細設定]ダイアログボックスが表示されます。ここでは、挿入するフィールドおよび関数を選択して、XPath式の編集ができます。
条件の詳細設定ダイアログボックス
条件の詳細設定ダイアログボックス

  • LINEで送る
  • このエントリーをはてなブックマークに追加

バックナンバー

連載:Expression Webチュートリアル

著者プロフィール

  • 小濱 良恵(コハマ ヨシエ)

    Microsoft MVP for Expression Web MSソフトの解説書やWeb記事を執筆するテクニカルライター。Expression Webの前身となるFrontPageは2000バージョンから使用しはじめ、個人サイト(www.wanichan.com) においてFrontPageや...

あなたにオススメ

All contents copyright © 2005-2021 Shoeisha Co., Ltd. All rights reserved. ver.1.5