| |
|
ここから、「ショッピングカートを見る」と、「ショッピングカートに入れる」による各遷移に共通の処理について説明する。
ショッピングカートのデータを変更した後のショッピングカートの内容を確認する。ショッピングカート管理テーブルから注文個数を取得し、商品マスタから商品コード、商品名、販売価格を取得するクエリは次のようになる。
| cart.cfm 115行目〜119行目 |
<cfquery name="M_CartQry"
datasource="shopping">
SELECT M_Item.ItemID, M_Item.ItemCode, M_Item.ItemName,
M_Item.Price, T_Cart.ItemPeaces
FROM M_Item INNER JOIN T_Cart ON M_Item.ItemID = T_Cart.ItemID
WHERE CartID = '#Cookie.CreateUUID#'
</cfquery> |
|
上記のクエリ「M_CartQry」をcfoutpuタグを使用して出力してみよう。
cfoutputタグを使用してcfqueryの検索結果を表示する方法は、第2回で説明済のため省略する。
モックアップ(cart.html)の137行目〜206行目の部分をcfmで記述すると、cart.cfmの355行目〜378行目となる。
ポイントは下記の5点である。
| (1) |
ショッピングカート内容を表示するタグを、cfoutputタグで囲む。
cart.cfm 355行目、378行目 |
| (2) |
表示項目を変数に置き換える。
cart.cfm 357, 358, 359行目 |
| (3) |
金額を表示するために、NumberFormat関数を使用する。
cart.cfm 359行目 |
| (4) |
注文個数のテキストエリアに変数を表示する。
cart.cfm 362行目 |
| (5) |
#を使用している部分は、##に変更する。
※(5)はよく忘れがちなので、気をつけよう。 |
<cfoutput query="M_CartQry">
<tr>
<td bgcolor="##FFFFFF" nowrap><span
class="onedown">#M_CartQry.ItemCode#</span></td>
<td bgcolor="##FFFFFF"><span class="base">#M_CartQry.ItemName#</span></td>
<td align="right" bgcolor="##FFFFFF"><span
class="base">#NumberFormat(M_CartQry.Price)#</span></td>
<td bgcolor="##FFFFFF">
<input type="text" maxlength="3"
name="ItemPeaces" size="3" value="#M_CartQry.ItemPeaces#">
</td>
<td align="center" bgcolor="##FFFFFF">
<a href="javascript:imgSubmit(#M_CartQry.ItemID#,'Delete');">
<img src="common/image/delete_btn.gif"
width="35" height="23" border="0"
name="delete_1" alt="取消" >
</a>
</td>
</tr>
</cfoutput> |
|
ショッピングカートに入っている商品の合計金額を取得する。購入金額小計を別のフィールド名「price」、消費税を別のフィールド名「tax」
、購入金額合計を別のフィールド名「total」 として取得するSQLをcfqueryタグを用いて記述する。
<cfquery name="Total_M_CartQry"
datasource="shopping">
SELECT SUM(M_Item.Price*T_Cart.ItemPeaces) as price,
Int((SUM(M_Item.Price*T_Cart.ItemPeaces))*0.05) as tax,
Int((SUM(M_Item.Price*T_Cart.ItemPeaces))*1.05) as total
FROM M_Item INNER JOIN T_Cart ON M_Item.ItemID = T_Cart.ItemID
WHERE CartID = '#Cookie.CreateUUID#'
</cfquery> |
|
クエリ「 Total_M_CartQry」をcfoutpuタグを使用して出力してみよう。
モックアップ(cart.html)の215行目〜232行目の部分をcfmで記述すると、cart.cfmの393行目〜412行目となる。
ここでの出力に関してのポイントは下記の2点である。
| (1) |
ショッピングカート内容を表示するタグを、cfoutputタグで囲む。
cart.cfm 393行目、412行目 |
| (2) |
表示項目を変数に置き換え、 NumberFormat関数を使用して表示する。
cart.cfm 401, 403, 405行目 |
<cfoutput query="Total_M_CartQry">
<td align="right">
<table border="0" cellpadding="0"
cellspacing="0">
<tr>
<td bgcolor="##FF9900">
<table border="0" cellpadding="4"
cellspacing="1">
<tr>
<td bgcolor="##FF9900">
<img src="common/image/subtotal.gif"
width="39" height="11" border="0"
alt="小計"></td>
<td bgcolor="##FFFFFF">
<span class="base">#NumberFormat(Total_M_CartQry.price)#円</span></td>
<td bgcolor="##FF9900">
<img src="common/image/tax.gif" width="39"
height="11" border="0" alt="消費税"></td>
<td bgcolor="##FFFFFF">
<span class="base">#NumberFormat(Total_M_CartQry.tax)#円</span></td>
<td bgcolor="##FF9900">
<img src="common/image/total.gif"
width="39" height="11" border="0"
alt="合計"></td>
<td bgcolor="##FFFFFF">
<span class="base"><b>#NumberFormat(Total_M_CartQry.total)#円</b></span></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</cfoutput> |
|
|