デフォルトボタンの定義

コンテナの defaultButton プロパティを使用して、デフォルトの Button コントロールを定義します。任意のフォームコントロールにフォーカスがあるときに Enter キーを押すと、Button コントロールを明示的に選択したときと同じように、デフォルトの Button コントロールのクリックイベントがトリガされます。

たとえば、ログインフォームは、ユーザー名とパスワードの入力および送信用の Button コントロールを表示します。ユーザー名を入力し、Tab キーでパスワードフィールドに移動してパスワードを入力した後、Enter キーを押すと、ログイン情報を送信できます。Button コントロールを明示的に選択する必要はありません。このような操作を定義するには、defaultButton に、送信用 Button コントロールの id を設定します。次の例では、送信用ボタンの click イベントに対するイベントリスナーによって、Alert コントロールが表示されます。これは、いずれかのフォームフィールドにフォーカスがあるときにユーザーが Enter キーを押すと、Flex によってこのイベントがトリガされることを示します。この例の中でコメントアウトされている行は、ユーザーのログインを行うための Web サービスを起動する、実際のアクションを実行する部分です。

<?xml version="1.0"?>
<!-- containers\layouts\FormDefButton.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script> 
        <![CDATA[
            import flash.events.MouseEvent;
            import mx.controls.Alert;
    
            private function submitLogin(eventObj:MouseEvent):void {
                // Display an Alert to show the event happened.
                Alert.show("Login Requested");
                // Commented out to work without a web service.
                //myWebService.Login.send();
            }   
        ]]>
    </mx:Script>

    <mx:Form defaultButton="{mySubmitButton}">
        <mx:FormItem label="Username">
            <mx:TextInput id="username" 
                width="100"/>
        </mx:FormItem>
        <mx:FormItem label="Password">
            <mx:TextInput id="password" 
                width="100" 
                displayAsPassword="true"/>
        </mx:FormItem>
        <mx:FormItem>
            <mx:Button id="mySubmitButton" 
                label="Login" 
                click="submitLogin(event);"/>
        </mx:FormItem>
    </mx:Form>
</mx:Application>

メモ

 

ComboBox コントロールのドロップダウンリストが展開されているときに Enter キーを押すと、その ComboBox コントロールで現在ハイライト表示されているアイテムが選択されます。このとき、デフォルトボタンのクリックイベントはトリガされません。


Flex 2.01