フォームに入力した複数行のデータを受け取るには
見積書、受注情報などの明細行から複数のアイテムを入力するフォームを作成したとき、フォームに入力した複数行のデータを受け取る方法を説明します。
|
|
図 フォームに入力した複数行のデータを受け取るサンプル
Access + Webのダウンロードにサンプルが収録されています。ダウンロードの目次を表示させたら、｢複数行のデータを受け取るサンプル｣をクリックしてください。Internet Explorerの左側のフレームには、ASPのソースが表示されます。右側のフレームには、明細行を入力するフォームが表示されます。
行28-35では、明細行をfor…nextループで生成しています。商品コード、商品名、単価、数量の<input type=”text”>タグのname=には重複した名前を指定しています。
<tr>
<td><input type="text" size="10" name="txtProdID"></td>
<td><input type="text" size="20" name="txtProdName"></td>
<td><input type="text" size="10" name="txtUnitPrice"></td>
<td><input type="text" size="10" name="txtQuantity"></td>
</tr>
・・・
<tr>
<td><input type="text" size="10" name="txtProdID"></td>
<td><input type="text" size="20" name="txtProdName"></td>
<td><input type="text" size="10" name="txtUnitPrice"></td>
<td><input type="text" size="10" name="txtQuantity"></td>
</tr>
明細行１、２、３に商品コード、商品名、単価、数量を入力したら送信ボタンをクリックします。送信ボタンをクリックすると、行22の<form>タグのaction=で指定したASPファイルをロードします。（このサンプルでは、自分自身FormMultiItems.aspを指定しています。）
行43のRequest.Form(“txtProdID”)コレクションのCountプロパティでは、商品コードのエレメント数を取得しています。このサンプルには、明細行が5行ありますので5が返ります。（ブラウザのurlにサンプルのASPファイルを直接入力してロードさせたときは、Countプロパティに0が返ります。）明細行が0より大なら行45-55を実行します。
行46-55のfor…nextループでは、明細行1-5に入力したデータをResponse.Writeでブラウザに送信しています。行47では、カレントの明細行のテキストボックスに商品コードが入力されているか調べています。商品コードが入力されていないときは、最終行と判断してfor…nextループを終了させます。商品コードが入力されているときは、Request.Formコレクションにエレメント名＋インデックス番号を指定して値を取得します。
response.write(request.form("txtProdID")(intI) & ", ")
response.write(request.form("txtProdName")(intI) & ", " )
response.write(request.form("txtUnitPrice")(intI) & ", ")
response.write(request.form("txtQuantity")(intI))
èA101, Item1, 1000, 1
èB201, Item2, 2000, 2
èC301, Item3, 3000, 3
このサンプルでは、明細行を５行に固定にしていますがDHTMLを使用すれば明細行を実行時に追加/削除することができます。
リスト FormMultiItems.aspのソースコード
|
1: <%@ language=vbscript %> 2: <% option explicit %> 3: <% 4: dim intI 5: dim intItems 6: %> 7: <html> 8: <head> 9: <style> 10: span.style1 { 11: font-family: "ＭＳ ゴシック"; 12: font-size: 80%; 13: } 14: span.style2 { 15: font-family: "ＭＳ ゴシック"; 16: font-size: 80%; 17: color: blue; 18: } 19: </style> 20: </head> 21: <body> 22: <form action="FormMultiItems.asp" method="post"> 23: <span class="style1"> 24: <table> 25: <tr> 26: <th>コード</th><th>商品名</th><th>単価</th><th>数量</th> 27: </tr> 28: <% for intI = 1 to 5 %> 29: <tr> 30: <td><input type="text" size="10" name="txtProdID"></td> 31: <td><input type="text" size="20" name="txtProdName"></td> 32: <td><input type="text" size="10" name="txtUnitPrice"></td> 33: <td><input type="text" size="10" name="txtQuantity"></td> 34: </tr> 35: <% next %> 36: </table> 37: <br> 38: <input type="submit" value=" 送 信 "> 39: </span> 40: </form> 41: <span class="style2"> 42: <% 43: intItems = request.form("txtProdID").count 44: if intItems > 0 then 45: response.write("<hr>") 46: for intI = 1 to intItems 47: if len(request.form("txtProdID")(intI)) = 0 then 48: exit for 49: end if 50: response.write(request.form("txtProdID")(intI) & ", ") 51: response.write(request.form("txtProdName")(intI) & ", " ) 52: response.write(request.form("txtUnitPrice")(intI) & ", ") 53: response.write(request.form("txtQuantity")(intI)) 54: response.write("<br>") 55: next 56: end if 57: %> 58: </span> 59: </body> 60: </html> |