イベント処理の作成
ファンクションキーを作成したら、キーが押下された時の処理を作成します。
F3、F4、F5キーには既にブラウザのキー動作を設定してあるので、F1、F2、F6に独自の処理を設定します。F1キーには、独自にHTMLで作成したヘルプページを表示する機能を、F2キーにはテキストボックスの入力値をクリアする機能を、F6キーにはホームページを表示する機能を組み込みます。これらは、FunctionKeyコントロールのクライアント側イベントを使用するので、コードはJavaScriptでWebページのHTML内に作成します。
TextBoxコントロールにデータを読み込む処理
最初に、F2キーでテキストボックスの入力値をクリアする機能の動作確認をするために、Page_LoadイベントハンドラのTextBoxコントロールにテキストファイルのテキストを読み込む処理を作っておきます。この処理は、Page_Loadイベントハンドラに作成します。
テキストファイルは、サイトのサブディレクトリ「App_Data」に格納してある「Sample.txt」というファイルで、FileクラスのReadAllTextメソッドを使用して読み込みます。この時、テキストファイルが格納されているサブディレクトリ「App_Data」の絶対パスを、PageクラスのMapPathメソッドで取得してファイル名に結合し、ReadAllTextメソッドでデータを読み出します。
Imports System.IO
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim pp As String = Page.MapPath("App_Data")
Dim readText As String = File.ReadAllText(pp & "/Sample.txt", Encoding.Default)
Me.TextBox1.Text = readText
End Sub
using System.IO;
protected void Page_Load(object sender, EventArgs e)
{
string pp = Page.MapPath("App_Data");
string readText = File.ReadAllText(pp + "/Sample.txt", System.Text.Encoding.Default);
TextBox1.Text = readText;
}
JavaScriptによるイベント処理
次に、F1、F2、F6キーのイベント処理を作成します。これは、FunctionKeyDownイベントハンドラの作成から始めます。
- まず、「Default.aspx」の「デザイン」画面を表示し、プロパティウィンドウの「ClientEvents」を展開して、「FunctionKeyDown」プロパティの値欄をクリックします。リストに［新しいハンドラを追加］が表示されるので、これをクリックします。
［新しいハンドラを追加］をクリックする
- イベントハンドラの名前を確認するダイアログが表示されるので、そのまま［OK］ボタンをクリックします。
そのまま［OK］ボタンをクリックする
- 作成したWebページ「Default.aspx」のビューを、「デザイン」から「ソース」に切り替え、HTML編集モードにします。
自動的に、<head>ブロックにJavaScriptで「FunctionKey1_FunctionKeyDown」イベントハンドラが作成されているので、ここに処理を記述します。処理は、まずイベントハンドラの引数「eArgs」の「FunctionKey」プロパティで、押されたキーの種類を判別します。そして、Webページを表示する場合はwindow.openメソッドで実行します。
TextBoxコントロールのテキストをクリアする場合は、documentオブジェクトのgetElementByIdメソッドでTextBoxコントロールを把握し、valueプロパティの値を空白にします。
<script language="javascript" type="text/javascript" id="FunctionKey1_Script0">
function FunctionKey1_FunctionKeyDown(oFunctionKey, eArgs)
{
if (eArgs.FunctionKey == FunctionKeys.F1) {
window.open("ヘルプ.html");
}
if (eArgs.FunctionKey == FunctionKeys.F2) {
document.getElementById("TextBox1").value = "";
}
if (eArgs.FunctionKey == FunctionKeys.F6) {
window.open("http://www.grapecity.com/japan/inputman5/");
}
}
</script>
以上で、できあがりです。
まとめ
ファンクションキーは、メニューの階層を辿らずに、直接実行したい機能にアクセスできるため、とても便利な機能です。
InputMan for ASP.NET 3.0J のファンクションキーコントロールは、プロパティの設定だけでファンクションキーを実装でき、イベント処理もJavaScriptで作成できるので、Webページに手軽に実装できます。また、スタイルシートをサポートしているので、Webデザイナと共同でページのデザインを行うことができるのも便利な機能の1つです。
製品情報
