入力テキストに半角英数字のみ入力可能にする

✔ 概要

入力テキストに半角英数字のみ入力可能とします。
ここでは、入力テキストからフォーカスを外したタイミングで全角文字のチェック処理を行い、入力した文字列に全角文字が含まれていた場合はアラートメッセージを表示後、入力した文字列を削除する方法を説明します。

フォーム形式により、設定方法が異なります。

フォームの場合

設定方法

オブジェクトの配置

入力フォーム上にチェック対象とする入力テキストを配置します。

JavaScriptファイルの登録

  • 以下のJavaScriptをテキストファイルに記述します。
    ここでは例として「checkChar」という名前の関数を記述します。
    拡張子を"js"にして任意のファイル名(半角英数字)で保存します。

    function checkChar(elm){
        var txt=elm.value;
        for(i=0 ; i < txt.length ; i++){
            if(escape(txt.charAt(i)).length >= 4){
                alert("半角英数字を入力してください");
                elm.value="";
                break;
            }
        }
    }
    

    注意

    登録するファイルはUTF-8形式で作成してください。

  • 作成したJavaScriptファイルを外部ファイルとしてサーバーおよびフォームに登録します。
    登録方法は 外部ファイルとしてJavaScriptを登録する を参照ください。

オブジェクトの設定

オブジェクトの配置 で配置した入力テキストに以下の設定を行います。

  • [HTML]タブ

    項目 設定値
    JavaScript

    トリガー/JavaScriptイベントで以下を選択します。

    トリガー フォーカスを外す
    JavaScriptイベント名 onBlur

    トリガーを選択後、[編集]ボタンをクリックし、以下のスクリプトを設定します。

    // チェック処理呼び出し
    checkChar(document.getElementsByName('ITEXT000')[0]);
    

    注釈

    「ITEXT000」の部分には、オブジェクトの配置 で配置したオブジェクト名を記載してください。

フォームの保存

Formエディターでフォームを保存します。

動作確認

Formエディター ツールバーの[HTMLプレビュー]からプレビューを表示します。
プレビュー画面にて、半角文字のみ入力が可能となっていることを確認してください。

旧バージョン形式のフォーム(JSP)の場合

設定方法

オブジェクトの配置

入力フォーム上にチェック対象とする入力テキストを配置します。

JavaScriptファイルの登録

  • 以下のJavaScriptをテキストファイルに記述します。
    ここでは例として「checkChar」という名前の関数を記述します。
    拡張子を"js"にして任意のファイル名(半角英数字)で保存します。

    function checkChar(elm){
        var txt=elm.value;
        for(i=0 ; i < txt.length ; i++){
            if(escape(txt.charAt(i)).length >= 4){
                alert("半角英数字を入力してください");
                elm.value="";
                break;
            }
        }
    }
    

    注意

    登録するファイルはUTF-8形式で作成してください。

  • 作成したJavaScriptファイルを外部ファイルとしてサーバーおよびフォームに登録します。
    登録方法は 外部ファイルとしてJavaScriptを登録する を参照ください。

オブジェクトの設定

オブジェクトの配置 で配置した入力テキストに以下の設定を行います。

  • [JSP]タブ

    [追加]ボタンをクリックし、以下を設定します。

    イベントタイミング onBlur
    実行するJavaScript

    以下のスクリプトを設定します。

    // チェック処理呼び出し
    checkChar(document.getElementsByName('PTEXT000')[0]);
    

    注釈

    「PTEXT000」の部分には、オブジェクトの配置 で配置したオブジェクト名を記載してください。

フォームの保存

Formエディターでフォームを保存します。

動作確認

Formエディター ツールバーの[HTMLプレビュー]からプレビューを表示します。
プレビュー画面にて、半角文字のみ入力が可能となっていることを確認してください。

旧バージョン形式のフォーム(PDF)の場合

設定方法

オブジェクトの配置

入力フォーム上にチェック対象とする入力テキストを配置します。

Acrobat JavaScript関数の登録

全角文字をチェックする関数を登録します。

  • Formエディターのメニューバーで[オプション - アクション(PDF) - JavaScript関数登録]を選択します。[追加]ボタンをクリックし以下を設定します。

    項目 設定値
    関数名

    任意の関数名

    例)checkChar

    関数名を入力後、フォーカスを外すと、Acrobat JavaScriptの入力欄が有効になり、関数の雛形が表示されます。
    Acrobat JavaScript

    以下のAcrobat JavaScriptを記述します。

    function checkChar(elm){
    
        // 引数から入力された値を取得
        var txt=this.getField(elm).valueAsString;
    
        //1文字ずつ取り出し判定
        for(i=0 ; i < txt.length ; i++){
            if(escape(txt.charAt(i)).length >= 4){
                app.alert("半角英数字を入力してください");
                this.getField(elm).value = "";
                break;
             }
        }
    }
    
  • 入力後、[OK]ボタンをクリックし[JavaScriptの編集]ダイアログ、[JavaScript関数登録]ダイアログを閉じます。

オブジェクトの設定

オブジェクトの配置 で配置した入力テキストに以下の設定を行います。

  • [アクション]タブ

    項目 設定値
    トリガー フォーカスを外す
    アクション

    [追加]ボタンをクリックし以下を設定します。

    アクションの選択 JavaScriptの実行
    JavaScriptの編集

    以下のAcrobat JavaScriptを記述します。

    checkChar("PTEXT000");
    

    注釈

    「PTEXT000」の部分には、オブジェクトの配置 で配置したオブジェクト名を記載してください。

フォームの保存

Formエディターでフォームを保存します。

動作確認

Formエディター ツールバーの[PDFプレビュー]-[入力時PDF]からプレビューを表示します。
プレビュー画面にて、半角文字のみ入力が可能となっていることを確認してください。