如何使用 javascript 隐藏 Zend 元素标签

Question

您好，我有一个脚本可以根据 select 下拉菜单的值来隐藏和显示要呈现的 select 元素。

function testOnClick(){ 
  var e = document.getElementById("role");

  var selectValue = e.options[e.selectedIndex].value;

  alert(selectValue);
  if(selectValue == 1)
  {       
     // $("#item").toggle();
      $("#sub_unit").show();
      $("#sub_unit_dropdown").hide();
      $('#sub_unit_dropdown').parent().children().hide()    
    }
  else
  {
      $("#sub_unit").hide();
      $('#sub_unit').parent().children().hide()
      $("#sub_unit_dropdown").show();
      }

}

这是 zend 元素

 $this->add(array(
            'name' => 'role',
                'id'   => 'role',
            'type' => 'Zend\Form\Element\Select',
            'options' => array(
                'label' => 'Role',              
                'empty_option' => '(Please select)',
                'value_options' => array(
                    '1' => 'Manager',
                    '2' => 'Employee',
                ),
            ),
        ));

        $this->add(array(
            'name' => 'status',
            'type' => 'Zend\Form\Element\Select',
            'options' => array(
                'label' => 'Status',
                'value_options' => array(
                    '1' => 'Active',
                    '2' => 'Inactive',
                ),
            ),
        ));

        $this->add(array(
            'name' => 'sub_unit',
            'id'   => 'sub_unit',               
            'type' => 'Zend\Form\Element\Select',
            'options' => array(
                'label' => 'Sub Unit / Team',
                'value_options' => $this->getOptionsForSubUnit(),
                'description' => 'Hold down the control (ctrl) button to select multiple options',
            ),
            'attributes' => array(
                'multiple' => true,
                'size'     => 12,
            ),
        ));

          $this->add(array(
            'name'       => 'sub_unit_dropdown',
            'id'        => 'sub_unit_dropdown',
            'type'       => 'Zend\Form\Element\Select',
            'options'    => array(
                'label' => 'Sub Unit / Team',
                'value_options' => $this->getOptionsForSubUnit(),
            ),
            'attributes' => array(
                'size'     => 12,
                'class' => 'input-medium'
            ),
        ));

它工作正常，它隐藏和显示哪个 select 元素将被隐藏或显示，但问题是隐藏 select 元素的标签仍然可见。如何将它与需要隐藏的 select 元素一起隐藏？

TIA

Answer 1

请测试这是否有效，

$this->add(array(
        'name'       => 'sub_unit_dropdown',
        'id'        => 'sub_unit_dropdown',
        'type'       => 'Zend\Form\Element\Select',
        'options'    => array(
            'label' => 'Sub Unit / Team',
            'label_attributes' => array('class' => 'hidethelabel'),
            'value_options' => $this->getOptionsForSubUnit(),
        ),
        'attributes' => array(
            'size'     => 12,
            'class' => 'input-medium'
        ),
    ));

基本上我认为你可以添加一个 class 或一个 id

'label_attributes' => array('class' => 'hidethelabel')

并在脚本中使用 id/class 来隐藏标签。

只是一个想法。

如何使用 javascript 隐藏 Zend 元素标签

How to hide Zend Element Label using javascript

javascript

jquery

zend-framework