2009-04-22 13 views
6

Ich habe ein Button-Element, das ich wie so erstellt haben:Zend Framework Zend_Form Dekoratoren: <span> Inside Button Element?

$submit = new Zend_Form_Element_Button('submit'); 
$submit->setLabel('My Button'); 
$submit->setDecorators(array(
    'ViewHelper', 
    array('HtmlTag', array('tag' => 'li')) 
)); 
$submit->setAttrib('type', 'submit'); 

Dies erzeugt folgende HTML:

<li> 
    <label for="submit" class="optional">My Button</label> 
    <button name="submit" id="submit" type="submit">My Button</button> 
</li> 

Ich möchte die Innenseite der Taste mit einem < Spanne einzuwickeln> , wie folgt:

<button...><span>My Button</span></button> 

Was ist der beste Weg, dies mit Zend_Form zu tun?

Antwort

7

Ich habe es versucht und habe es letztendlich auch nicht geschafft, dies mit dem gleichen Ansatz zu erreichen. Es scheint, dass der einfachste Weg, dies zu tun zu tun wäre:

... 
$submit->setLabel('<span>My Button</span>'); 
... 

Allerdings wird die Spanne entwertet werden. Es ist durchaus möglich, das Entkommen eines lable Dekorateur auszuschalten, aber das Hinzufügen einer Labeldekorator die Ausgabe falsch, zum Beispiel macht:

$decorator = array(
    array('ViewHelper'), 
    array('HtmlTag', array('tag' => 'li')), 
    array('Label', array('escape' => false)) 
); 

$submit = new Zend_Form_Element_Button('submit'); 
$submit->setLabel('<span>My Button</span>'); 
$submit->setDecorators($decorator); 
$submit->setAttrib('type', 'submit'); 

... macht:

<label for="submit" class="optional"><span>My Button</span></label> 
<li> 
    <button name="submit" id="submit" type="submit">&lt;span&gt;My Button&lt;/span&gt</button> 
</li> 

... die ist, abgesehen davon, dass es semantisch inkorrekt (leicht zu reparieren) ist, immer noch den Span Tags innerhalb des Elements.

Also was machst du?

Nun, ich denke, der beste Ansatz (und das ist mein Meta-Ratschlag, wenn es um strenge Kontrolle über Zend_Form Rendering geht) ist die ViewScript Dekorateur verwenden.

$submit = new Zend_Form_Element_Button('submit'); 
$submit->setLabel('My Button'); 
$submit->setDecorators(array(array('ViewScript', array('viewScript' => '_submitButton.phtml')))); 
$submit->setAttrib('type', 'submit'); 

... dann in _submitButton.phtml Folgendes definieren:

<li> 
    <?= $this->formLabel($this->element->getName(), $this->element->getLabel()); ?> 
    <button 
    <?php 

    $attribs = $this->element->getAttribs(); 

    echo 
    ' name="' . $this->escape($this->element->getName()) . '"' . 
    ' id="' . $this->escape($this->element->getId()) . '"' . 
    ' type="' . $this->escape($attribs['type']) . '"'; 
    ?> 
    <?php 

    $value = $this->element->getValue(); 

    if(!empty($value)) 
    { 
     echo ' value="' . $this->escape($this->element->getValue()) . '"'; 
    } 
    ?> 
    > 
    <span> 
    <?= $this->escape($this->element->getLabel()); ?> 
    </span> 
    </button> 
</li> 

Die _submitButton.phtml Datei müssen in einem View Skript-Verzeichnis sein (man könnte am besten sein, das Hinzufügen eine spezielle für Ihre Formular-Dekoratoren mit $view->addScriptPath('/path/to/my/form/decorators')).

Dies sollte machen, was Sie suchen. Ich habe gerade erst angefangen, den ViewScript-Dekorator aufgrund von Flexibilitätsproblemen in meiner Arbeit zu betrachten.Sie werden feststellen, dass mein Skript nicht so flexibel ist, und es ist sicherlich nicht in BNF, alle Elemente, die für das Element-Objekt aufgefüllt werden können. Das heißt, es ist ein Anfang und es löst Ihr Problem.

+0

Vielen Dank für die sehr detaillierte Antwort. Ich kenne den ViewScript-Decorator, aber ich wusste nicht, dass er auf einzelne Elemente angewendet werden kann. – leek

+0

Das war sehr hilfreich! – markus

0

Ich würde der Schaltfläche eine Klasse hinzufügen und dann diese Klasse in Ihrem CSS definieren, damit sie wie eine Spanne funktioniert. Ich bin sicher, dass Sie mehr tun wollen, als nur in einer Spanne zu bleiben.

Fügen Sie einfach eine weitere setAttrib() -Aufruf:

$submit->setAttrib('class', 'submitButton'); 

Dann in Ihrem CSS:

.submitButton { 
    display:inline; 
    font-weight:bold; /* Or whatever you're wanting to do */ 
} 

Ich habe display: inline, da dies die Taste wirkt wie eine Spanne machen. Das sollte dich wenigstens an den Start bringen. Natürlich können Sie Ihr CSS auch auf der ID der Schaltfläche basieren, verwenden Sie einfach display: inline, um das Span-Verhalten zu erhalten.

+0

Mein Ziel ist eigentlich „Knopf Spanne {display: none;}“ zu tun, den Text der Schaltfläche zu verbergen (aber ich möchte es noch da, ohne CSS für die Menschen sein,/JS-Unterstützung). – leek

+0

Aaah. Ich wusste, dass da noch etwas anderes war! – Kekoa

5

Sie können dies tun:

$this->addElement(new Zend_Form_Element_Button(
      'send', 
      array(
       'label' => '<span>registrieren</span>', 
       'class' => 'button-red', 
       'type' => 'submit', 
       'escape' => false, 
       'required' => false, 
       'ignore' => false, 
      ) 
)); 
+0

DANKE !!!!!! – wiLLiamcastrO

1

einfach das Etikett zu entkommen funktioniert gut. Es bricht nur, wenn jemand beginnt mit dem Labeldekorator Messing (geschieht normalerweise, wenn Tags Customizing)

Sie können die Zend_Form Funktion setElementDecorators() verwenden und einige Elemente von Styling auszuschließen. Lesen Sie Beispiel # 3 Einstellen Dekoratoren für einige Elemente in Zend_Form Manual (einschließlich der Hinweis!) Für weitere Details.

Für diejenigen, die immer noch verwirrt sind, ist hier ein Beispiel-Code die Form als Tabelle, um Stil und eine Schaltfläche, die in Doppel Spannweite eingeschlossen ist:

//(...)putting some other elements in the form first 

//now add submit button 
$form  ->addElement('button', 'submit', array(
         'label'  => '<span><span>SUBMIT</span></span>', 
         'value'  => 'submit' 
      )); 

$form 
      //set decorators for non-button elements 
      ->setElementDecorators(array(
        'ViewHelper', 
        'Errors', 
        array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'element')), 
        array('Label', array('tag' => 'td')), 
        array(array('row' => 'HtmlTag'), array('tag' => 'tr'))), array('submit'), false) 
      //and then for button elements only 
      ->setElementDecorators(array(
        'ViewHelper', 
        'Errors', 
        array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'element')), 
        array(array('row' => 'HtmlTag'), array('tag' => 'tr'))), array('submit'), true) 
      //and finally for the form 
      ->setDecorators(array(
        'FormElements', 
        array('HtmlTag', array('tag' => 'table')), 
        'Form' 
      )); 

wo $ form ist ein Zend_Form Element. Hoffe das hilft!

0

Versuchen mit

$element->addDecorator('Label', array('tag' => 'span', 'class' => 'aClass'))