在Drupal 7中动态隐藏/显示Field API字段


14

我创建了一个带有“添加新”表格的实体。实体本身具有有限数量的实际变量。我使用自定义字段(即Field API)添加了我需要的大多数额外数据。

在此阶段,我需要做的是能够根据另一个字段的值动态隐藏一个字段。即,如果下拉字段的值设置为“否”,则应隐藏另一个字段,否则应显示该字段。

据我所知,将此功能添加到使用Form API创建的字段(即通过AJAX属性)有点容易,但是有没有办法使用附加字段来实现它呢?如果要解决此问题,使用自定义Java脚本不会有任何问题。


我不确定drupal.org/project/conditional_fields是否准备好使用d7,但可能值得研究
Jukebox,

Answers:


5

jQuery为此很好地工作:

(function($) {
  $(document).ready(function() {
    $('#select1').change(function() {
      switch ($(this).val()) {
        case '1':
          $('#field2').hide();
          break;
        default:
          $('#field2').show();
          break;
      }
    });
  });
}) (jQuery);

是的,我最终在表单页面上使用了drupal_add_js并最终在jQuery中完成了它。我只是想知道是否还有一种更“ Drupal”的方式来做到这一点。
NRaf 2011年

我要指出的是,我不是Drupal #states方法提高可见度的忠实拥护者,这就是为什么我没有在上面建议的原因。
keithm 2014年

@keithm您能否详细说明为什么您不喜欢国家(自2015年起,D7)。我正在一个项目中,我们试图决定使用#states vs drupal_add_js。您为什么认为一个是比另一个更好的选择?
blue928 2014年

我认为这是合法的程序员偏爱问题。我的理由可能与您的不同。就是说,在实践中,我宁愿不喜欢使用另一种语法来复制Javascript / jQuery中的功能。当我尝试#states时,我还发现显然设计得很有限的用例。当我的问题扩展到这些用例之外时,无论如何我不得不用纯Javascript重写整个过程。
keithm 2014年

19

在Drupal 7中,您可以使用$ form #states代替自定义jQuery脚本。例:

  $form['student_type'] = array(
    '#type' => 'radios',
    '#options' => array(
      'high_school'   => t('High School'),
      'undergraduate' => t('Undergraduate'),
      'graduate'      => t('Graduate'),
    ),
    '#title' => t('What type of student are you?')
  );

  // High school information.
  $form['high_school']['tests_taken'] = array(
    '#type' => 'checkboxes',
    '#options' => drupal_map_assoc(array(t('SAT'), t('ACT'))),
    '#title' => t('What standardized tests did you take?'),
    // This #states rule says that this checkboxes array will be visible only
    // when $form['student_type'] is set to t('High School').
    // It uses the jQuery selector :input[name=student_type] to choose the
    // element which triggers the behavior, and then defines the "High School"
    // value as the one that triggers visibility.
    '#states' => array(
      'visible' => array(   // action to take.
        ':input[name="student_type"]' => array('value' => 'high_school'),
      ),
    ),
  );

如果您要#states用于多个值条件,请参见以下示例:

 $form['student_type'] = array(
    '#type' => 'checkboxes',
    '#options' => array(
      'high_school'   => t('High School'),
      'undergraduate' => t('Undergraduate'),
      'graduate'      => t('Graduate'),
    ),
    '#title' => t('What type of student are you?')
  );

  // High school information.
  $form['high_school']['tests_taken'] = array(
    '#type' => 'textfield',
    '#title' => t('What standardized tests did you take?'),
    '#states' => array(
      'visible' => array(   // action to take.
        ':input[name="student_type[high_school]"]' => array('checked' => TRUE),
        ':input[name="student_type[undergraduate]"]' => array('checked' => TRUE),
        ':input[name="student_type[graduate]"]' => array('checked' => FALSE),
      ),
    ),
  );

有关更多详细信息和示例,请参见“ form_example/form_example_states.inc来自示例”模块


说到#states,我从未找到定义更复杂可见性条件的方法,例如:当控件B的值在array(x,y,z)中时,隐藏控件A。您碰巧知道一种语法吗?
Artur 2012年

1
请参阅上方的更新
milkovsky

4

您应该尝试使用条件字段,我认为此模块是完成此任务的必备条件。您可以在用户友好的管理界面上设置字段之间的依赖关系。例如,您可以设置A字段设置为仅可见如果B字段值“ 1234 ”,也可以设置C文本框是可见的,只有当D现场检查,或者集E无形的,如果F就是集中

在上载表单上,这些依赖项将在客户端设置,在节点显示中,这些依赖项将在服务器端设置。

您可以在设置这些依赖项admin/structure/types/manage/[YOURCONTENTTYPESMACHINENAME]/dependencies

条件字段 (图片来源:项目页面

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.