2015-04-30 2 views
0

Я пытаюсь установить шрифт awesome или glyphicon (или даже изображение) внутри кнопки отправки. Это быстро разваливается, и мне нужно реализовать другой вариант. Я видел несколько способов сделать это, но я не знаю, что такое «правильный» или лучший способ.Styling submit buttons - Rails app

три претендента, которые я видел, являются:

  • дивы
  • ссылки
  • кнопки

Какой самый лучший способ, чтобы получить изображение/значок Внутри "отправить" кнопка?

Не все ли три компонента должны иметь JS-компонент?

+0

Следует ли вместо этого использовать «Программист Exchange»? – Jeff

+0

Хорошо. Я думаю, что некоторые из них говорили такие вещи, как «Если вы сделаете ссылку, отправьте форму, она не будет работать на клиентах, которые не запускают JS». – Jeff

+0

Проверьте, как bootstrap добавляет глификон в элемент кнопки http://getbootstrap.com/components/#glyphicons-examples –

ответ

1

Это как Bootstrap добавить glyphicon на объект кнопки:

<button type="button" class="btn btn-default btn-lg"> 
    <span class="glyphicon glyphicon-star" aria-hidden="true"></span> Star 
</button> 

Bootstrap button with glyphicon

+0

И вам нужно будет использовать JS подать с такой кнопкой? Это нормально? – Jeff

+0

не нужно отправлять JS. Реплицируйте bootstrap css в свой проект, чтобы имитировать этот стиль кнопки, и я думаю, что он выполнит эту работу. –

+0

В настоящее время я использую этот код, и кнопки ничего не делают. – Jeff

1

вариант Кнопка не нуждается в JS. Я испытал это, и вы можете увидеть рабочий пример использования шрифта Удивительная здесь https://jsfiddle.net/mikhailjan/sf9s28et/5/ или просто посмотреть код ниже:

<form action="add_person.php"> 
    First name:<br> 
    <input type="text" name="firstname" value="Mickey"> 
    <br> 
    Last name:<br> 
    <input type="text" name="lastname" value="Mouse"> 
    <br><br> 

    <button type="submit" class="button"> 
    <i class="fa fa-user-plus"></i> Add Person 
    </button> 

</form> 

Джонатан Anctil правильно, кнопка должна иметь type="submit" для формы, чтобы нормально работать.