Yanuar Ihsan
Yanuar Ihsan

Reputation: 115

How to make a Ajax Submit Button with an html tag inside the label

i want add fontawesome icon in ajaxsubmitbutton,

<?php echo CHtml::ajaxSubmitButton('<i class="fa fa-plus"></i> Print Preview',
array('ma/select'),
array(  'success'=>'reloadGrid',
        'error'=>'js:function(data){
            alert("Please select checkbox");
            return false;
        }'),
array(  //'encodeLabel'=>false,
        'class'=>'btn btn-success',
        )); ?>


i have try to set encodeLabel to false, and try encode to false, all of them doesn't work,
does anyone know how to about that??? thank you

Upvotes: 0

Views: 329

Answers (1)

Andy Theos
Andy Theos

Reputation: 3346

Why do you use encodeLabel? The problem is that FontAwesome stylesheets use before pseudo-elements to add icon.

:after and :before pseudo elements, they can only be put on container elements. Why? Because they are appended inside that particular element. input is not a container. button for instance is hence you can put them on.

echo CHtml::ajaxSubmitButton( '&#xf067; Print Preview ', $url, array(),
 array('encode'=>false)
)

And in CSS something like this:

input[type="submit"] {
  font-family: FontAwesome, 'Ubuntu', sans-serif;
}

For further reference check this: How do I add a Font Awesome icon to input field?

Upvotes: 2

Related Questions