Issues passing value from javascript/jquery to controller using hidden input

Question

below is my code:

public with sharing class myController {
    public String passedInString { get; set; }

    public PageReference passedInValue() {
        system.debug('Passed in value: '+passedInString);
        return null;
    }    
}

My VF:

<apex:page controller="myController">
    <apex:includeScript value="{!URLFOR($Resource.myStatic, '/js/jquery-2.1.1.min.js')}"/>  
    <p>Click Me!</p>
    <button type="button" id="addScnt" onclick="setHidden()">Pass Input</button>
    <apex:form id="myForm">
        <apex:inputHidden value="{!passedInString}" id="myHiddenField"/>
        <apex:actionFunction name="setHidden" action="{!passedInValue}" rerender="myHiddenField"/>
    </apex:form>
    <script type="text/javascript">
        j$ = jQuery.noConflict();
        function setHidden() {
        var copyOfStr = 'Test string';
        document.getElementById('{!$Component.myForm.myHiddenField}').value = (copyOfStr);
    }   
    </script>     
</apex:page>

When the button is clicked I expect the javascript function to be run and the value of the hidden input set. Inspecting the log in developer console I was expecting the passedInValue action method in the actionfunction to fire as well showing the debug statement of the passedInString value but that didn't happen.

Answer 1

Both your action function and your own javascript function are called "setHidden".

Call your actionFunction something else and then call that from your own defined setHidden function.