フォームを用意する
とりあえず、Apache Clickを使ってページを作成表示させることはできました。今度は、フォームを使って、簡単な値をやり取りさせてみましょう。まずは、テンプレート側の修正からです。helo.htmを次のように修正します。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Helo</title> <link rel="stylesheet" type="text/css" href="style.css"></link> $imports </head> <body> <h1>Hello Click!</h1> <p>$msg</p> <p>$form</p> </body> </html>
修正されているのはわずか2箇所だけです。まずヘッダー部分に「$imports」というものが埋め込まれています。これはApache Clickが用意するオブジェクトで、「コントロール」と呼ばれる部品を使う際に必要となるスタイルシートやスクリプトファイルをロードするための情報が含まれています。これを記述しておくことで、コントロールに必要なものがこのWebページに用意されます（コントロールについてはこの後で説明します）。
もう1つは、ボディ部分に追加された「$form」というものです。こちらは、フォーム・コントロールのオブジェクトが保管されています。
Apache Clickでフォームなどを利用する場合、テンプレートにフォーム関係のタグを記述しておくことはあまりありません。Apache Clickには、フォームなどのHTMLの部品となるクラスが用意されています。これを使うことで、テンプレート側にその部品を生成するためのHTMLタグが自動的に出力されるようになっています。これが「コントロール」と呼ばれるクラスです。
Pageクラスでコントロールのインスタンスを用意し、これをPageクラスに設定しておくと、それをテンプレートに埋め込むことで、自動的にフォームがレンダリングされ表示されます。コントロールを利用することにより、フォームなどの値のチェックや前回入力された値の保持などが自動的に行われるようになります。
HeloPageクラスの修正
では、Pageクラスを修正しましょう。HeloPage.javaを開き、ソースコードを次のように修正してください。
package jp.codezine.click;
import org.apache.click.Page;
import org.apache.click.control.*;
public class HeloPage extends Page {
public Form form;
private TextField input;
private Submit submit;
public String msg = "";
public HeloPage (){
form = new Form("form");
input = new TextField("input","入力：");
submit = new Submit("submit", "送信");
form.add(input);
form.add(submit);
}
@Override
public void onInit(){
msg = "お名前は？";
}
@Override
public void onPost(){
msg = "こんにちは、" + input.getValue() + "さん！";
}
}
できあがったら、プロジェクトを再公開してブラウザからhttp://localhost:8080/clickapp/にアクセスしてみましょう。入力フィールドのあるシンプルなフォームが表示されます。ここでテキストを入力し送信すると、メッセージが表示されます。ごく簡単なものですが、フォームを使った処理がされているのが分かります。
