htmlで入力したデータをサーバ側に送信する方法 その2
htmlで入力したデータをサーバ側に送信する方法 その1で、サーバ側に送りたいコントロールをフォームで囲むところまで説明しました。
今回はその続きを説明します。
サーバ側ではコントロールのname属性をキーに値を取得するので、それぞれのコントロールにname属性を指定します。
<form action="" method="post" name="frmMain">
<!-- コントロールにname属性を指定します -->
商品名：<input type="text" name="txtName">
単価：<input type="text" name="txtPrice">
<input type="button" value="登録">
</form>これでサーバ側に送信するモノは準備出来ました。
javascriptのsubmitコマンドを実行しサーバに送信を行います。
サーバ側にはフォームを送信するので、javascriptのコマンドはdocument.frmMain.submit();となります。
サーバ側にデータを送信する処理を実装したaspファイルは下記のようになります。
<!DOCTYPE HTML>
<html>
<head>
<title>商品マスタ</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script Language="JavaScript">
function touroku(){
document.frmMain.submit(); //サーバ側に送信する処理を実装
}
</script>
</head>
<body>
<table class="common-table">
<caption>商品マスタ</caption>
<thead>
<tr>
<th>商品コード</th>
<th>商品名</th>
<th>単価</th>
</tr>
</thead>
<tbody>
<%
'商品マスタを出力するサーバ処理は省略します
%>
</tbody>
</table>
<form action="" method="post" name="frmMain">
商品名：<input type="text" name="txtName">
単価：<input type="text" name="txtPrice">
<input type="button" value="登録" onclick="touroku();">
</form>
</body>
</html>