Visualforce:传递隐藏输入到控制器变量

Question

我试图使用jQuery自动完成传递值到我的控制器。自动完成似乎不能与apex:inputField一起工作，所以我被迫使用html输入。问题是我似乎无法正确地获得输入中的值。

自动完成正在工作，并将填充值测试值，测试2

我有一个字符串变量隐藏 {get;在控制器中设置。我想获取Id为apiName的输入内容并将其保存到控制器变量hidden

<apex:page standardController="Object__c" extensions="ctrl">
    <script src="https://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="https://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css"/>
    <script type="text/javascript">
        //Create a new variable j$ just to avoid any conflicts with other libraries which may be using $.
        var j$ = jQuery.noConflict();
        //Capture the list of countries in a Array.
        var myVar = ['test value','Test 2'];
        //on Document ready
        j$(document).ready(function(){
            j$("#apiName").autocomplete({
                source : myVar
            });
        });
    </script> 
     <script type="text/javascript">
      function setHidden() {
        var hiddenRep = document.getElementById('theHiddenInput');
        hiddenRep.value = document.getElementById('apiName').value;
      }
    </script>
  <apex:form >
      <apex:pageBlock >
          <apex:pageBlockButtons location="top">
              <apex:commandButton value="Save" action="{!save}" onclick="setHidden();"/>
          </apex:pageBlockButtons>
          <apex:pageblockSection >    
                <input id="apiName"/>
                <apex:inputHidden value="{!hiddenValue}" id="theHiddenInput"/>
          </apex:pageblockSection> 
      </apex:pageBlock>
  </apex:form>
</apex:page>

Answer 1

要在JavaScript中引用Visualforce组件，你必须为该组件的id属性指定一个值。DOM ID是由组件的ID属性和包含该元素的所有组件的ID属性组合而成的。

有两种工作方式:

1) Visualforce页面中的每个组件都有自己的Id属性。在呈现页面时，该属性用于生成文档对象模型(Document Object Model, DOM) ID。使用Component.Path.to美元。Id来引用页面上的特定组件，其中Path.to.Id是被引用组件的组件层次结构说明符。

function setHidden() {
        var hiddenRep = document.getElementById('{!$Component.theHiddenInput}');
        hiddenRep.value = document.getElementById('apiName').value;
      }

function setHidden() {
   j$('[Id*='theHiddenInput']').first().val( document.getElementById('apiName').value)
}

Answer 2

我已经解决了这个问题。最后起作用的是

function setHidden() {
       j$("[id*='theHiddenInput']").val(j$("[id*='apiName']").val());
}