Explanation of apex:commandButton with apex:actionSupport
So I'm currently working off the example for apex:actionSupport given in the VF dev docs. All is fine with the example. I now am looking to have a apex:commandbutton click initiate the refresh of the counter variable. I changed the VF page to the following:
When I hit the apex:command button I'm seeing that the counter variable increments and displays for a couple ms but then get's reverted back. I believe this might have something to do with order of getters?
When use it actually submits the page. You could see the HTML button actually type is submit.
A button that is rendered as an HTML input element with the type attribute set to submit, reset, or image, depending on the tag's specified values. The button executes an action defined by a controller, and then either refreshes the current page, or navigates to a different page based on the PageReference variable that is returned by the action.
That's the reason, it is submitting the page and re-initiating the counter
Workable code will be (without actionSupport):
Here with the use of action you can submit the page and increment the counter and use rerender attribute to refresh the counter.
<apex controller="exampleCon"> <apex> <apex id="counter"> <apex value="Increment" action="{!incrementCounter}" reRender="text1"> </apex> <apex value="Current Count: {!count}" id="text1"> </apex> </apex>Otherwise putting action="{!incrementCounter}" in commandbutton will keep the incrementCounter but, it makes no sense to use actionSupport with the commandButton in this scenario.
<apex id="counter"> <apex value="Increment" action="{!incrementCounter}"> <apex event="onclick" action="{!incrementCounter}" rerender="counter" status="counterStatus"> <apex value="Current Count: {!count}"> </apex>apex:CommandButton component is used to create a buttons like Save, Delete, Edit,cancel on Visualforce page.