Как мне отформатировать Zend_Form_Element_Radio, чтобы метка следовала за вводом? - PullRequest
Новая
       30

Как мне отформатировать Zend_Form_Element_Radio, чтобы метка следовала за вводом?

5 голосов
/ 04 сентября 2010

Декоратором по умолчанию для Zend_Form_Element_Radio является 

<label for="type_id-1"><input type="radio" name="type_id" id="type_id-1" value="1">Pack</label>

Тег label оборачивает тег input. Вместо этого я хотел бы выглядеть как 

<input type="radio" name="type_id" id="type_id-1" value="1"><label for="type_id-1">Pack</label>

Я подумал, что это может быть связано с "Меткой" элемента, но это не так. Даже со следующим кодом, я все еще получаю этикетку, обертывающую радио. Когда я использую этот код формы. 

public function init()
{
    parent::init();

    $this->setName('createdomain');

    $type_id = new Zend_Form_Element_Radio('type_id');
    $type_id->setLabel('Please Choose')
            ->setRequired()
            ->setMultiOptions(array('m' => "male", 'f' => 'female'));

    $this->addElement($type_id);

    $this->setElementDecorators(array(
    'ViewHelper',
     array('Label',array('placement' => 'APPEND')),
));       
}

В результате я получаю этот HTML 

<form id="createdomain" enctype="application/x-www-form-urlencoded" action="" method="post"><dl class="zend_form">
<label for="type_id-m"><input type="radio" name="type_id" id="type_id-m" value="m">male</label><br />
<label for="type_id-f"><input type="radio" name="type_id" id="type_id-f" value="f">female</label>
<label for="type_id" class="required">Please Choose</label></dl>
</form>

Обратите внимание, как существует тег label, заключающий тег input?

Ответы [ 6 ]

3 голосов
/ 29 ноября 2010

Я создал пользовательский помощник вида с именем MyLib_View_Helper_FormRadio (поэтому он вызывается автоматически, если это происходит при начальной загрузке), а также переопределил и изменил метод Zend_View_Helper_FormRadio :: formRadio () в строке 160 (версия 1.11), где установлен переключатель создано. 

$label = '<label ' . $this->_htmlAttribs($label_attribs) . ' for="' . $optId . '">'
               . $opt_label 
               .'</label>';

        // Wrap the radios in labels
        $radio =  '<input type="' . $this->_inputType . '"'
                . ' name="' . $name . '"'
                . ' id="' . $optId . '"'
                . ' value="' . $this->view->escape($opt_value) . '"'
                . $checked
                . $disabled
                . $this->_htmlAttribs($attribs)
                . $endTag;

        if ('prepend' == $labelPlacement) {
            $radio = $label . $radio;
        }
        elseif ('append' == $labelPlacement) {
            $radio .= $label;
        }
0 голосов
/ 07 июня 2011

Мой ответ из другого поста на ту же тему должен помочь вам Zend-форма для multicheckbox удалить ввод из ярлыков

0 голосов
/ 01 апреля 2011

Это лучшее, что вы можете сделать, что я нашел после большой боли :)) 

$radios = new Zend_Form_Element_Radio('notifications');
$notificationTypesArray = array();
foreach ($notificationTypes as $key => $value) {
     $notificationTypesArray[$key] = $value
$radios->removeDecorator('DtDdWrapper');
$radios->removeDecorator('HtmlTag');
$radios->setSeparator('</td></tr><tr><td class="notification_type_row">');
$radios->setDecorators(array(
    'ViewHelper',
    'Errors',
    array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'notification_type_row')),
    array('Label', array('tag' => 'span')),
    array(array('row' => 'HtmlTag'), array('tag' => 'tr')),
);
$radios->addMultiOptions($notificationTypesArray);              
$this->addElement($radios);
0 голосов
/ 16 января 2011

Возможно, моя лучшая идея на данный момент - изменить HTML-код ZF [Zend Framework] из jQuery, чтобы он стал совместимым с форматом пользовательского интерфейса jQuery.

Вот решение:

в форме конструкции ZF: 

$this->setElementDecorators(array(
                                'ViewHelper',
                                'Errors',
                                array(array('rowElement'=>'HtmlTag'), array('tag'=>'div', 'class'=>'element')),
                                array('Label', array('class'=>'first')),
        ));

Важная вещь здесь - это div с элементом class =, который обернет все входные данные [чтобы их было легко найти в jQuery]

А вот код JS: 

$(function() {
    $( "div.element > label" ).each(function() {
        $('input', this).after('<label for="'+$(this).attr('for')+'"></label>');
        $('label', this).text($(this).text());
        var input = $('input', this).detach();
        var label = $('label', this).detach();

        var parent = $(this).parent();
        $(this).remove(); 
        input.appendTo(parent);
        label.appendTo(parent);
    });
    $( "div.element" ).buttonset();
});
0 голосов
/ 04 января 2011

Это проблема с jQuery, а не с Zend Framework.Обертывание элемента в теге label совершенно корректно, просто jQuery UI его не поддерживает.Я опубликовал отчет об ошибке .

* Обновление ответа *

Однако я думаю, что вы пытаетесь сделать (как вы прокомментировали)использовать набор кнопок jQuery UI, что я и делал, когда натолкнулся на ошибку jQuery UI.Короче говоря, у вас есть два варианта, пока ошибка не будет исправлена:

1) Используйте специальный помощник Денниса Д., чтобы переопределить элемент переключателя по умолчанию.

2) Патч Zend FrameworkРадиокнопка просмотра помощника с кодом написана Денисом Д.Он появляется в файле Zend_View_Helper_FormRadio в строке 169 (Zend Framework Version 1.11.0).

Во-первых, создайте новую метку и закройте тег 

// Create the label
$label = '<label'
. $this->_htmlAttribs($label_attribs) . ' for="' . $optId . '">'
. (('prepend' == $labelPlacement) ? $opt_label : '')
. '<input type="' . $this->_inputType . '"'
. $opt_label
. '</label>';

Во-вторых, измените код, который создает радиоНажмите кнопку: 

// Create the radio button
$radio = '<input type="' . $this->_inputType . '"'

В-третьих, удалите закрывающий тег метки (как вы уже это сделали) в помощнике вида, измените: 

. $endTag
. (('append' == $labelPlacement) ? $opt_label : '')
. '</label>';

И просто замените на:

. $endTag;

Затем объедините радио и метку, используя позиционирование размещения: 

// Combine the label and the radio button
if ('prepend' == $labelPlacement) {
    $radio = $label . $radio;
} else {
    $radio = $radio . $label;
}

И это все (снова Деннис D сделал это в помощнике вида), но измененный код долженвыглядеть (начиная со строки 169: 

// Create the label
        $label = '<label'
                . $this->_htmlAttribs($label_attribs) . ' for="' . $optId . '">'
                . $opt_label
                . '</label>';

        // Create the radio button
        $radio = '<input type="' . $this->_inputType . '"'
                . ' name="' . $name . '"'
                . ' id="' . $optId . '"'
                . ' value="' . $this->view->escape($opt_value) . '"'
                . $checked
                . $disabled
                . $this->_htmlAttribs($attribs)
                . $endTag;

        // Combine the label and the radio button
        if ('prepend' == $labelPlacement) {
            $radio = $label . $radio;
        } else {
            $radio = $radio . $label;
        }
        // add to the array of radio buttons
        $list[] = $radio;
0 голосов
/ 04 сентября 2010

Попробуйте: 

$this->setElementDecorators(array(
        'ViewHelper',
         array('Label',array('placement' => 'APPEND')),
    ));

Проверьте Zendcasts видео об этом это действительно здорово.Декораторы могут быть действительно сложными с ZF, но это видео действительно объясняет это хорошо.

...