LoginSignup
1
1

More than 3 years have passed since last update.

Salesforce apex:actionFuntionnの注意事項

Last updated at Posted at 2020-08-01

<apex:actionFunction>タグについて、SalesforceのVisualforceページの非同期処理時利用されるタグです。
reRender属性で指定されたID領域は非同期の部分更新エリアです。
部分更新エリアに<apex:inputText>タグがある場合、そのタグにhtml-name属性を定義する場合、サーバ側との通信がおかしくなる。

・まず、name属性なしの場合の動きとコードは以下となります。簡単なサンプルコードです。

 ※ここで注意して欲しいのは<apex:inputText>タグにhtml-name属性が定義されてない。

testActionFunction.v
<apex:page controller="TestApex">
    <apex:form >
        <apex:outputPanel id="reRenderArea">
            入力項目:<apex:inputText value="{!testInput}" html-placeholder="入力してください" /><br/>
            出力項目:<apex:outputText value="{!testOutput}" /><br/>
            <a onclick="test()">サーバ側へ送信</a>
            <apex:actionFunction action="{!testActionFunction}" name="test" reRender="reRenderArea"/>
        </apex:outputPanel>
    </apex:form>
</apex:page>
TestApex.cls
public class TestApex {
    public String testInput{get;set;}
    public String testOutput{get;set;}
    public void testActionFunction() {
        testOutput = 'Your Input is : ' + testInput;
    }
}

画面の動きは以下となります。サーバとの通信は何回でも正常です。
初期表示     ⇨ 1111.png
1回目入力する  ⇨ 5555.png
送信ボタン押下後 ⇨ 2222.png
2回目入力する  ⇨ 3333.png
送信ボタン押下後 ⇨ 4444.png


・次は、html-name属性がある場合、動きはどうなるでしょうか一緒に見てみましょう。

 ※1回目のサーバとの通信は変わらないが、2回目のサーバ通信を注目してください。
 testActionFunction.vfのページコードにある<apex:inputText>タグが以下コードで置換する。

testActionFunction.v
入力項目:<apex:inputText value="{!testInput}" html-name="testName" html-placeholder="入力してください" />

画面の動きは以下となります。
初期表示     ⇨ 1111.png
1回目入力する  ⇨ 5555.png
送信ボタン押下後 ⇨ 2222.png
2回目入力する  ⇨ 3333.png
送信ボタン押下後 ⇨ 2222.png


・事象:

1回目「1111」を入力し、サーバ側へ送信リンクを押下して、画面上入力された情報とサーバから送信された情報が正しく表示されるが、その後、入力項目に「2222」を変更し、サーバ側へ送信リンクを再度押下して、入力項目に「2222」が保持されないし、サーバから送信された情報も正しく表示されない。
2回目以降の内容は常に1回目の情報が保持されてしまう。何故なんでしょうかね。
原因はわからないが、今後<apex:inputText>タグを利用する時、更新エリアにhtml-name属性が利用しないように注意するしかないですね。
もし理由がわかる方がいれば、是非ご教示して頂きたいです。

1
1
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
1
1