We have moved our forum to GitHub Discussions. For questions about Phalcon v3/v4/v5 you can visit here and for Phalcon v6 here.

Is it possible to add a glyphicon in the submit button?

I know i can add classes like this:

$this->add(new Submit('Button', array( 'class' => 'btn btn-success' )));

But what about a bootstrap's glyphicon? Is it possible?

You need to extend the class, but anyway Phalcon\Forms\Element\Submit it's rendered as an input tag, and input tags are empty elements, see #permitted content



33.8k

A Bootstrap's glyphicon is just an element with a class. I'm sure that what you say'll work (just remember to include the CSS file in the HTML):

$this->add(new Submit('Button', ['class' => 'btn btn-success glyphicon glyphicon-user']));


7.1k

I tried and the only thing that changed was the font; it doesnt show any glyph.

A Bootstrap's glyphicon is just an element with a class. I'm sure that what you say'll work (just remember to include the CSS file in the HTML):

$this->add(new Submit('Button', ['class' => 'btn btn-success glyphicon glyphicon-user']));


7.1k
edited Mar '15

I tried this:

$submitSession = new Submit('Login');

$submitSession->tag->tagHtml("span", array("class" => "glyphicon glyphicon-log-in", "aria-hidden" => "true"));

$submitSession->tag->tag_html_close("span");

But i got a exception saying that tag is null. Do I need to extend Submit class, add a tag element and then add glyphicon tag?

You need to extend the class, but anyway Phalcon\Forms\Element\Submit it's rendered as an input tag, and input tags are empty elements, see #permitted content



6.4k
Accepted
answer

I tried this:

$submitSession = new Submit('Login');

$submitSession->tag->tagHtml("span", array("class" => "glyphicon glyphicon-log-in", "aria-hidden" => "true"));

$submitSession->tag->tag_html_close("span");

But i got a exception saying that tag is null. Do I need to extend Submit class, add a tag element and then add glyphicon tag?

You need to extend the class, but anyway Phalcon\Forms\Element\Submit it's rendered as an input tag, and input tags are empty elements, see #permitted content

Quite simple

<?php

use Phalcon\Tag,
    Phalcon\Forms\Element,
    Phalcon\Forms\ElementInterface,
    Phalcon\Forms\Exception;

class BootstrapButton extends Element implements ElementInterface {

    protected $_icon;

    public function __construct($name, $attributes = NULL, $icon = NULL) {
        $this->_icon = $icon;

        if (! $attributes) {
            $attributes = [];
        }

        if (! isset ($attributes['type'])) {
            $attributes['type'] = 'submit';
        }

        parent::__construct($name, $attributes);
    }

    public function getIcon() {
        return $this->_icon;
    }

    public function setIcon($icon) {
        $this->_icon = $icon;

        return $this;
    }

    public function render($attributes = NULL, $icon = NULL) {
        $icon = $icon ?: $this->_icon;

        return (
            Tag::tagHtml('button', $this->prepareAttributes($attributes), FALSE, TRUE).
            Tag::tagHtml('i', ['class' => $icon]).
            Tag::tagHtmlClose('i').
            Tag::tagHtmlClose('button')
        );
    }

}

Ex:

<?php

echo new BootstrapButton('name', ['class' => 'btn btn-default'], 'glyphicon glyphicon-asterisk');
// => <button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-asterisk"></i></button>

I really don't understand the benefit of all this code, when just writing the HTML by hand would suffice.



7.1k

Thank you, it works.

I tried this:

$submitSession = new Submit('Login');

$submitSession->tag->tagHtml("span", array("class" => "glyphicon glyphicon-log-in", "aria-hidden" => "true"));

$submitSession->tag->tag_html_close("span");

But i got a exception saying that tag is null. Do I need to extend Submit class, add a tag element and then add glyphicon tag?

You need to extend the class, but anyway Phalcon\Forms\Element\Submit it's rendered as an input tag, and input tags are empty elements, see #permitted content

Quite simple

<?php

use Phalcon\Tag,
  Phalcon\Forms\Element,
  Phalcon\Forms\ElementInterface,
  Phalcon\Forms\Exception;

class BootstrapButton extends Element implements ElementInterface {

  protected $_icon;

  public function __construct($name, $attributes = NULL, $icon = NULL) {
      $this->_icon = $icon;

      if (! $attributes) {
          $attributes = [];
      }

      if (! isset ($attributes['type'])) {
          $attributes['type'] = 'submit';
      }

      parent::__construct($name, $attributes);
  }

  public function getIcon() {
      return $this->_icon;
  }

  public function setIcon($icon) {
      $this->_icon = $icon;

      return $this;
  }

  public function render($attributes = NULL, $icon = NULL) {
      $icon = $icon ?: $this->_icon;

      return (
          Tag::tagHtml('button', $this->prepareAttributes($attributes), FALSE, TRUE).
          Tag::tagHtml('i', ['class' => $icon]).
          Tag::tagHtmlClose('i').
          Tag::tagHtmlClose('button')
      );
  }

}

Ex:

<?php

echo new BootstrapButton('name', ['class' => 'btn btn-default'], 'glyphicon glyphicon-asterisk');
// => <button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-asterisk"></i></button>


7.1k

I just wanted to define all form's elements in form.php and render it in form.volt.

I really don't understand the benefit of all this code, when just writing the HTML by hand would suffice.