How to pass javascript value to controller..?

Question

I want to pass the java-script value to controller.I am using repeat on VF page.

VF page

    <apex:repeat value="{!listAdj}" var="Adj" id="hrs">

     <td><div class="requiredInput"><div class="requiredBlock"></div>
    <apex:inputField id="decimal" value="{!Adj.Hours_Decimal__c}" onchange="setHidden5(this);" >
      </apex:inputField>
    </div></td>      

     <apex:inputField id="hours" value="{!Adj.Hours__c}" />
<apex:inputField id="decimal" value="{!Adj.Hours_Decimal__c}" onchange="setHidden5(this);"/>

            </apex:repeat>

Javascript code

function setHidden5(element){
    //split the id of the inputField by ':' and then use the 5th index in the array to exact position of the inputField in the apex:repeat.
  var idArray = element.id.split(':');
    var hiddenRep1 =document.getElementById("thePage:form:hrs:hrs:"+idArray[4]+":decimal");
         var hiddenRep2 = document.getElementById("thePage:form:hrs:hrs:"+idArray[4]+":hours");


    if(element.value.length >=1){

      document.getElementById("thePage:form:hrs:hrs:"+idArray[4]+":hours").disabled = true;
**hiddenRep2.value=hidden1.value;**
               }                  
          }
    }

I want to pass the hiddenRep2.value to controller.How to pass that. Hidden2.value is same as hidden1.value + some addition subtraction.i dont know how to pass that value. Can someone me sort out this.

Thanks

Answer 1

There are multiple solutions for this question.

1. Use of hidden field

You can define an apex variable and associate it in a hidden input field on the visualforce page. Then set a javascript variable to this field an reference it in controller:

Apex class:

public class myClass {
    // Our test variable        
    public String myString {get; set;}

    public myClass(){
        myString = '';
    }

    // Method for testing a hidden field functionality 
    public PageReference myMethod(){
        System.debug('myString: ' + myString);
        return null;
    }
}

Visualforce page:

<script>
function setVar(param){
    jQuery('[id$=myHiddenField]').val(param);
    passStringToController();
}
</script>

<!-- Hidden field to store a new value of the variable -->
<apex:inputHidden value="{!myString}" id="myHiddenField"/>

<!-- Action function for the rerendering -->
<apex:actionFunction name="passStringToController" action="{!myMethod}" rerender="myHiddenField"/>

<!-- A command button for sending a call to the function -->
<apex:commandButton value="Test me" onclick="setVar('new value'); return false;" />

2. Use of apex:param

<script>
// We don't need any javascript function anymore
// because we will access an actionFunction directly
</script>

<!-- A new value will be set to the apex:param -->
<apex:actionFunction name="passStringToController" action="{!myMethod}" rerender="myHiddenField">
    <apex:param name="p1" value="" assignTo="{!myString}" />
</apex:actionFunction>

<!-- Here we can directly access the action function per name and assign a variable value -->
<apex:commandButton value="Test me" onclick="passStringToController('new value'); return false;" />

Answer 2

okay, this is a rather old question. But considering community (experience cloud) still only support vf page for login/reset password etc. I just found a new easier way to achieve it.

Instead of creating those action functions with params. Cookie is more straightforward, relatively speaking.

In your vf page javascript,

  var cookieString = "apex__YourCookieName=" +YourJSVar;
  document.cookie = cookieString;

You will need to append apex__ so apex controller can get it in the cookie class.

In your apex controller,

Cookie ck = ApexPages.currentPage().getCookies().get('YourCookieName');

Or just simply

String varValue = ApexPages.currentPage().getCookies().get('YourCookieName').getValue();