如何将值从 javascript 传递到 drupal 8 表单？答案

【问题标题】：How to pass a value from javascript to drupal 8 form?如何将值从 javascript 传递到 drupal 8 表单？
【发布时间】：2016-11-18 10:28:10
【问题描述】：

我需要将一个值从 Javascript 传递到我的 drupal 8 表单。

我在表单中添加了一个隐藏字段。 Javascript 正在计算一个值并将其写入该字段。但是我怎样才能得到函数 submitForm() 中的值呢？

使用隐藏字段是否是正确的方法？如果是这样，我该怎么做才能完成这项工作？

为了便于阅读，我删除了大部分代码。

FooForm.php:

class FooForm extends FormBase
{
    public function getFormId()
    {
        return 'fooID';
    }
    public function buildForm(array $form, FormStateInterface $form_state)
    {

    //...here are lot's of elements not relevant right now

    $form['myhiddenfield'] = ['#type' => 'hidden'];//adding hidden field.
    $form['#attached']['library'][] = 'foo/foocalculator';

    return $form;
    }

    public function submitForm(array &$form, FormStateInterface $form_state)
    {
    dpm($form_state->getValues()['myhiddenfield']);//not getting the calculated value.
    }

foocalculator.js：

(function ($, Drupal) {
    passToDrupal = $('#myhiddenfield');
    $('#edit-submit--3').click(function (event) {
        calcRoute(address, $editparcel.fieldValue().toString())
    });
})(jQuery, Drupal);

function calcRoute(start, destination) {
    var request = {
        origin: start,
        destination: destination,
    };
    directionsService.route(request, function (result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        directionsDisplay.setDirections(result);
        mydistance = result.routes[0].legs[0].distance.value;
        passToDrupal.val(mydistance);//adds value to hidden field.
    }    
    });
}

【问题讨论】：

标签： javascript drupal

【解决方案1】：

隐藏字段有点特殊，因为字段值的变化在提交的值中是不直接可见的（可以通过 $form_state->getValues() 检索）。相反，它们在表单状态的用户输入值中可见，所以试试这个：

$form_state->getUserInput()['myhiddenfield']

对隐藏字段使用 getUserInput() 时要小心，因为除非您有充分的理由这样做（就像您在本例中所做的那样），否则隐藏字段的更改通常由“不友好”实体完成，这正在尝试破坏您的网站。

【讨论】：

我花了几个小时在 _SESSION 和 \Drupal::service('user.private_tempstore') 中存储数据，只是想放弃。但这有效。非常感谢。

【解决方案2】：

你应该为你的隐藏字段设置一个默认值：

$form['bid'] = array('#type' => 'hidden', '#default_value' => '');

取自： https://api.drupal.org/api/drupal/developer%21topics%21forms_api_reference.html/7.x#hidden

请注意，如果您打算使用 JavaScript 更改隐藏元素的值，则需要使用 #default_value 属性而不是 #value。

我在 Drupal 8 中进行了测试，效果很好。

【讨论】：