1. ホーム
  2. javascript

[解決済み] jspでjavascriptを使用する方法

2022-02-19 03:28:10

質問事項

値を返すjavascriptの関数を呼び出して、その値をif文に入れたいのです。HTMLには2つのラジオボタンがあり、javascriptはどれがクリックされたかを確認します。その後、JSPはそれを「customers」または「company」と比較し、適切なSQLクエリを実行します。

ジャバスクリプトです。

 function corc{
    var value;

    if(document.getElementById('cust').checked){
           value='customer';
            return value;
    }else if(document.getElmentById('comp').checked){
           value='company';
           return value;
    }
 }

JSPです。

if(%>corc();<%.equals("customer")){
             String sqlqueryCommand = "SELECT * from customer where login='" + v1 + "' and password='" + v2     + "'";
}else if (%>corc();<%.equals("company")){
             String sqlqueryCommand = "SELECT * from company where login='" + v1 + "' and password='" + v2     + "'";
}

解決方法は?

  • JSPはサーバー側で実行され、JavaScriptはクライアント側で実行されるため、JSPのif文ではJavaScriptの関数を呼び出すことができません。

  • ラジオボタンの1つがクリックされたときにイベントを発生させる必要があります。 onclick イベントを使用すると、関数 corc() .

  • スクリプトレットをJSPで書いてはいけません。JSPを学ぶ エル は、その JSTL で、Javaのコードにはサーブレットを使用します。 JSPファイル内のJavaコードを回避するには?

JSPのコードです。

.......
........
//use <form> to submit values to servlet

 <input type="radio" name="radio1" onclick="handleClick(this.id);" id="customerId" />
 <input type="radio" name="radio1" onclick="handleClick(this.id);" id="companyId" />
......
.......
//use hidden field to assign table value i.e. "customer" or "company".
 <input type="hidden" name="tableValue" id="tableTextId" />  
//</form> closing form tag

onclick 割り当てたイベント handleClick 関数を使用し this.id パラメータ this.id を渡すために使用されます。 id 属性で指定されたラジオボタンをクリックします。

JavaScriptのコードです。

<script type="text/javascript">
  function handleClick(clickedId)
  {
     if(clickedId == "customerId")
       document.getElementById('tableTextId').value = "customer";
     else
       document.getElementById('tableTextId').value = "company";
  }
</script>

  • フォームを送信すると、サーブレットでhiddenフィールドの値を取得することができます。
<ブロッククオート

String tableName = request.getParameter("tableValue"); // 隠しフィールドの名前、つまりtableValueを渡します。

  • さらに、次のように渡すことができます。 tableName をクエリに追加します。

関連リンク