LoginSignup
3
3

More than 5 years have passed since last update.

選択リストで apex:actionSupportのRerenderが効かない時の対処法

Posted at

四時間ほど迷ってました。

やりたい事

こんな感じで単純に選択された値を別のエリアに表示したい。

スクリーンショット 2016-02-02 23.08.04.png
スクリーンショット 2016-02-02 23.08.13.png
スクリーンショット 2016-02-02 23.08.25.png

SelectListAndInputField.vfp
<apex:page controller="SelectListAndInputFieldController">
    <apex:form >
        <apex:pageBlock title="選択リストの onchange で rerender の確認">
            業種:
            <apex:inputField value="{!newAccount.Industry}" />
                <apex:inputField value="{!newAccount.Industry }" >                    
            <apex:actionSupport event="onchange" reRender="result"/>                    
        </apex:pageBlock>
    </apex:form>

    <!-- rerender される領域 -->
    <apex:outputPanel id="result">
        <apex:outputText >選択されている値: {!newAccount.Industry}</apex:outputText>
    </apex:outputPanel>
</apex:page>

※コントローラーは↓

躓いたところ

別の項目を追加したところ、値が取れなくなった!!というか、どうやらRerenderがうまく動作していないようだ。
どうなってんだ・・・
スクリーンショット 2016-02-02 23.12.03.png
スクリーンショット 2016-02-02 23.12.13.png
スクリーンショット 2016-02-02 23.12.21.png

SelectListAndInputField.vfp
<apex:page controller="SelectListAndInputFieldController">
    <apex:form >
        <apex:pageBlock title="選択リストの onchange で rerender の確認">
            名前:<apex:inputField value="{!newAccount.name}" />  <!-- **追加** -->
            業種:
            <apex:inputField value="{!newAccount.Industry}" />
                <apex:inputField value="{!newAccount.Industry }" >                    
            <apex:actionSupport event="onchange" reRender="result"/>                    
        </apex:pageBlock>
    </apex:form>

    <!-- rerender される領域 -->
    <apex:outputPanel id="result">
        <apex:outputText >選択されている値: {!newAccount.Industry}</apex:outputText>
    </apex:outputPanel>
</apex:page>

※コントローラーは↓

解決

apex:actionRegion で囲むとうまくいきました。
どうやら、newAccount.nameは必死項目のため空欄のままではサーバーに接続できず、rerender処理が行えない状態になっていた模様。
apex:actionRegionは囲った部分だけをサーバーに送ってくれるので、空欄の必須項目は無視してくれるとのこと。

SelectListAndInputField.vfp
<apex:page controller="SelectListAndInputFieldController">
    <apex:form >
        <apex:pageBlock title="選択リストの onchange で rerender の確認">
            名前:<apex:inputField value="{!newAccount.name}" />
            業種:
            <apex:actionRegion>
                <apex:inputField value="{!newAccount.Industry}" />
                    <apex:inputField value="{!newAccount.Industry }" >                    
                <apex:actionSupport event="onchange" reRender="result"/>                    
            </apex:actionRegion>
        </apex:pageBlock>
    </apex:form>

    <!-- rerender される領域 -->
    <apex:outputPanel id="result">
        <apex:outputText >選択されている値: {!newAccount.Industry}</apex:outputText>
    </apex:outputPanel>
</apex:page>
SelectListAndInputFieldController.apxc
public class SelectListAndInputFieldController {
    public Account newAccount {get;set;}
    public SelectListAndInputFieldController(){        
        newAccount = new Account();
    }     
}

応用 ~連動項目での対処法~

連動選択リストの場合は制御側も含めて actionRegion で囲いましょう

スクリーンショット 2016-02-02 23.24.28.png
スクリーンショット 2016-02-02 23.24.52.png
スクリーンショット 2016-02-02 23.25.02.png

SelectListAndInputField.vfp
<apex:page controller="SelectListAndInputFieldController">
    <apex:form >
        <apex:pageBlock title="選択リストの onchange で rerender の確認">
            名前:<apex:inputField value="{!newAccount.name}" />
            業種:
            <apex:actionRegion>
                <apex:inputField value="{!newAccount.Industry}" />
                <!-- ↑制御項目 ↓は連動項目 -->
                <apex:inputField value="{!newAccount.depPickList__c }" >                    
                    <apex:actionSupport event="onchange" reRender="result"/>                    
                </apex:inputField>
            </apex:actionRegion>
        </apex:pageBlock>
    </apex:form>

    <!-- rerender される領域 -->
    <apex:outputPanel id="result">
        <apex:outputText >選択されている値: {!newAccount.depPickList__c}</apex:outputText>
    </apex:outputPanel>
</apex:page>

※コントローラーは↑

参考にしたサイト

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
3