Page Refreshing and Resetting Visualforce Parameters

Question

Through a series of events, I have a visualforce component that

1. When a apex:outputLink is clicked calls a component controller method
2. Calls some javascript in the component
3. The javascript calls an actionfunction in the VF page that is displaying the visualforce component
4. The actionfunction calls a controller method in the VF page.

The page is refreshing when the apex:outputLink is clicked, the page is refreshed, the init method is called (the vf page has action="{!init}"), and as of that time all the visualforce parameters have already been reset to null. Additionally, all the elements in the DOM seem to have been reset.

How can I stop this from happening? I was under the impression that if I don't have any PageReference methods and all my actionfunctions have a reRender value, the page wouldn't be refreshed.

Visualforce Component:

<apex:outputPanel layout="block" styleClass="text">
    <apex:outputLink id="btnLeft" onClick="removeClicked_{!uniqueId}()">
        <apex:image value="/s.gif" alt="Remove"
            styleClass="leftArrowIcon" title="Remove" />
    </apex:outputLink>
    <apex:actionFunction name="removeClicked_{!uniqueId}" action="{!resetCurrentPage}" onComplete="javascript:moveSelectedOptions_{!uniqueId}('{!$Component.multiselectPanel}:rightList',
              '{!$Component.multiselectPanel}:leftList', '{!$Component.rightHidden}',
              '{!$Component.leftHidden}', '{!name}', false);" reRender="no-such-id"/>
</apex:outputPanel>

...

<script type="text/javascript">
...
if (!moveSelectedOptions_{!uniqueId}) {
  // Move the selected options in the idFrom listbox to the idTo
  // listbox, updating the corresponding strings in idHdnFrom and
  // idHdnTo
  var moveSelectedOptions_{!uniqueId} = function(idFrom, idTo, idHdnFrom, idHdnTo, componentName, isAdd) {
    console.log('moveSelectedOptions_{!uniqueId} called');
    console.log("componentName: " + componentName);

    listFrom = document.getElementById(idFrom);
    listTo = document.getElementById(idTo);
      console.log("listFrom: " + listFrom);
      console.log(listTo);
    for ( var x = 0; x < listTo.options.length; x++) {
      listTo.options[x].selected = false;
    }

    var selectedItem = false;
    var removedItems = "";
    var addedItems = "";
    for ( var x = 0; x < listFrom.options.length; x++) {
      if (listFrom.options[x].selected == true) {
          console.log("item selected");

          if (isAdd==true){
              addedItems += listFrom.options[x].value + ",";
          }
          else {
              removedItems += listFrom.options[x].value + ",";
          }
          listTo.appendChild(listFrom.options[x]);


          x--;
          selectedItem = true;

      }

    }
    console.log("removedItems: " + removedItems);
    if(removedItems.length > 0){
        removedItems = removedItems.slice(0,-1);
    }
    if(addedItems.length > 0){
        addedItems = addedItems.slice(0,-1);
    }

    listTo.focus();

    if (selectedItem){

      buildOutputString(listFrom, document.getElementById(idHdnFrom));
      buildOutputString(listTo, document.getElementById(idHdnTo));

      // added by vip@liquidhub.com add a call to external controller via actionFunction
      console.log("isAdd: " + isAdd);
      if ( isAdd==true) {
          if(multiselectAddMultipleListener!=null) {
            multiselectAddMultipleListener(componentName, addedItems);
          } else if (multiselectAddListener!=null) {
            multiselectAddListener(componentName);
          }
      }
      if ( isAdd==false && multiselectRemoveListener!=null) {multiselectRemoveListener(componentName , removedItems);   }
    }
  }
}
...
</script>

Visualforce Component Controller: resetCurrentPage is a void method and does not use return.

Visualforce Page:

<apex:actionFunction name="multiselectRemoveListener" action="{!multiselectRemoveListener}" status="loading" rerender="no-such-id">
    <apex:param name="firstParam" value="" assignTo="{!input_compName}"/>
    <apex:param name="secondParam" value=""  assignTo="{!values_removed}"/>
</apex:actionFunction>

Visualforce Page Controller: multiselectRemoveListener is a void method and does not use return.

Answer 1

apex:outputLink makes a normal a element, which causes navigation to occur by default. This means that if you don't cancel the default behavior, you will reload the page. You may want to consider apex:commandLink instead. Otherwise, make sure you prevent the default behavior by returning false:

<apex:outputLink id="btnLeft" onClick="removeClicked_{!uniqueId}(); return false;">