将 HTML 输入值传递给 APEX 控制器答案

【问题标题】：Passing HTML input val to APEX controller将 HTML 输入值传递给 APEX 控制器
【发布时间】：2016-02-23 00:38:45
【问题描述】：

我这几天一直在研究和尝试各种代码，但一直找不到可靠的解决方案，所以我来找大家，希望你们能指出我做错了什么。

在我的自定义 VF 页面上，我使用 4 个 HTML 输入标签，当用户单击生成按钮时，我希望将输入值传递到 Apex 控制器中进行操作。

这就是我现在所拥有的，减去这个问题不需要的代码。有了它，控制台输出始终为空...

页面代码：

<apex:page id="scheduler-page" standardController="Opportunity" extensions="DEMO_ScheduleOpportunityController" showHeader="false" sidebar="false" standardStylesheets="false">

<head>
    <script type="text/javascript">
        function Generate() {
            // setting variables with data from the page
            var codRequested = $("#datepicker").datepicker("getDate");
            var velocityRequested = $("#velocity-input").val();
            var mwdcRequested = $("#mwdc-input").val();
            var seriesRequested = $("#seriesList").val();
            // these 4 values displays properly in the JS console
            console.log('codRequested: ' + codRequested);
            console.log('velocityRequested: ' + velocityRequested);
            console.log('mwdcRequested: ' + mwdcRequested);
            console.log('seriesRequested: ' + seriesRequested);
            // passing values to the actionscript
            SetInitialVariables(codRequested, velocityRequested, mwdcRequested, seriesRequested);
        }
    </script>
</head>

<body>
    <apex:form id="scheduler-form">

        <apex:actionFunction name="SetInitialVariables" action="{!GenerateSchedule}">
            <apex:param name="codRequested" value="" />
            <apex:param name="velocityRequested" value="" />
            <apex:param name="mwdcRequested" value="" />
            <apex:param name="seriesRequested" value="" />
        </apex:actionFunction>

        <c:DEMOscheduleGeneration opportunity="{!opportunity}" seriesMap="{!seriesMap}" />
    </apex:form>

    <apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js" />
    <apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" />
</body>

组件代码：

<apex:component>
  <div id="generateContainer" class="container">
    <!-- generate button -->
    <div id="generate-button-wrap">
        <a id="generate" onclick="Generate()">Generate</a>
        <!-- calls JQ Generate function -->
    </div>
  </div>
</apex:component>

控制器代码：

public PageReference GenerateSchedule() {        
    String series = Apexpages.currentPage().getParameters().get('seriesRequested');
    String mwdc = Apexpages.currentPage().getParameters().get('mwdcRequested');
    String velocity = Apexpages.currentPage().getParameters().get('velocityRequested');
    String cod = Apexpages.currentPage().getParameters().get('codRequested');
    System.debug('Series: ' + series);
    System.debug('MWdc: ' + mwdc);
    System.debug('Velocity: ' + velocity);
    System.debug('COD: ' + cod);
    return null;
}

【问题讨论】：

控制器代码绝对不正确。在控制器代码中包含了一些 js（与 function Generate() { 相同，但 VF 控制器应使用 Apex 编写。因此，此代码根本无法编译。请包含正确的控制器代码。
感谢我发这篇文章时完全疏忽了，因为我的大脑被炒了。我将错误的代码复制到这篇文章中，但在我的控制器中设置正确。

标签： jquery html salesforce apex

【解决方案1】：

我认为您的解决方法很简单：您正在使用 jQuery 并且 $ 与内部 Salesforce 功能冲突。您需要使用 noConflict。这样做：

var j$ = jQuery.noConflict();
// setting variables with data from the page
var codRequested = j$("#datepicker").datepicker("getDate");
var velocityRequested = j$("#velocity-input").val();
....

无论您在哪里使用$，请使用j$。这应该可以解决您的问题。

【讨论】：

这似乎没有奏效，我的控制器中的所有内容仍在调试为空。
现在您需要检查代码。右键单击页面可让您在此 javascript 代码上设置断点以查看值是否正确。其他可能出错的事情 - 如果您使用本机输入，那么 salesforce 会附加到您提供的 id 上 - 请改用唯一的类名。还要检查 jQuery 是否被正确包含。你知道，你在这里几乎不需要 jQuery——你所做的只是引用一些 id 值。