指定された値段より安い商品だけを表示する

JAVA Scriptを使用すると、データベースを検索して、指定された範囲に含まれるデータだけを表示することができます。ここでは、自由に価格を指定して、その価格以下、またはその価格以上の商品をテーブルに表示する方法について考えてみましょう。

■　テキスト領域とメニューの配置

特価と定価のどちらの価格を対照にするかを選択するためのメニュー・商品の価格を指定するためのテキスト領域・範囲をしているためのメニューをページに配置します。

<SELECT ID="SearchTarget" SIZE="1">
<OPTION VALUE="tokka">特価</OPTION>
<OPTION VALUE="teika">定価</OPTION>
</SELECT>
<INPUT ID="Price" TYPE="text" SIZE="4">
<SELECT ID="SearchCondition" SIZE="1">
<OPTION VALUE=">=">円以上</OPTION>
<OPTION VALUE="<=">円以下</OPTION>
</SELECT>
<INPUT ID="ExecSearch" TYPE="button" VALUE="実行" onClick="SearchPrice()">

■　指定された価格帯の商品を表示する処理

指定された価格帯の商品だけを表示するJAVA Scriptを記述します。

function SearchPrice(){
list.FilterValue=Price.value;
list.FilterColumn=SearchTarget.value
list.FilterCriterion=SearchCondition.value;
list.Reset();
}

■　「FilterValue」プロパティと「FilterColumn」プロパティ

「FilterValue」プロパティには、絞込みを行う際に使用する数値や文字列を指定します。例えば、5以上や5以下の数値の行だけ絞り込む場合は、「FilterValue＝5」と指定します。
「FilterColumn」プロパティには、「=」「>=」「>」などの条件を指定します。例えば5以上の数値をもつ行だけに絞り込む場合は「>=」と指定します。と「FilterColumn」プロパティには、絞込みの対象とする項目（CSVファイルの1行目に記述した項目名）を指定します。

■　「Filter」プロパティ

例では、「FilterValue」プロパティ・「FilterColumn」プロパティ・「FilterCriterion」プロパティの３つを組み合わせて絞込みを行わせています。
このような絞込みは「Filter」プロパティを使用しても行うことができます。
「Filter」プロパティの設定は「list.Filter="tokka>300"」のような形式で行います。「Filter」プロパティを使用すると、例の「SearchPrice」関数を次のように書きかえることができます。

function SearchPrice(){
list.Filter=SerchTArget.value+SerchCondition.value+Price.value
list.Reset();
}

また、「Filter」プロパティを使用する場合は「list.Filter="tokka>300&teika<400"」のように複数の条件を組み合わせて指定することもできます。
このとき、両方の条件を満たさなければならない場合は「＆」を、どちらか片方の条件でも満たせばよい場合は「｜」を指定して条件を組み合わせます。

<<<戻る