Невозможно получить значение из кнопок HTML в представление Django

Вот мой оригинальный HTML с "радио" кнопками:

<div data-value="attending" class="radio-tempo col-sm-12">
    <button class="btn btn-default active" data-value="yes"><i class="fa fa-smile-o"></i>Yes</button>
    <button class="btn btn-default" data-value="no"><i class="fa fa-frown-o"></i>No</button>
</div>

Я хотел захватить значения в мой POST запрос, поэтому я изменил его и добавил имена и значения в мой HTML код:

<div data-value="attending" class="radio-tempo col-sm-12">
    <button name="button_yes" value="yes" class="btn btn-default active" data-value="yes"><i class="fa fa-smile-o"></i>Yes</button>
    <button name="button_no" value="no" class="btn btn-default" data-value="no"><i class="fa fa-frown-o"></i>No</button>
</div>

И views.py

def index(request):
    if request.method == 'POST':
        print(request.POST)

Вывод: 

<QueryDict: {'csrfmiddlewaretoken': ['zSRXL8dUDyWlSMdnHs3qTrNHWOHu3WC9eOWnDuI4wW95VvndDArPlS4vGPFTooDs'], 'FirstName': ['John'], 'LastName': ['Smith'], 'Message': ['bla bla']}>

Что я делаю неправильно? Я знаю, что лучшим способом было бы использовать обычные радиокнопки, но я хотел бы избежать CSS стилизации радиокнопок и сохранить оригинальные элементы HTML шаблона.

Кнопки не отправляются на сервер, если они не являются кнопками отправки и не были нажаты.

Вот модифицированная версия Как стилизовать радиокнопку, чтобы она выглядела как обычная кнопка Learn More Button

Это выглядит как кнопки, но будет отправлено на сервер

.radio-tempo {
  position: relative;
  display: block;
  text-align: center;
  width:100px;
}

.radio-tempo label {
  display: block;
  background: none;
  color: #01a7e1;
  border-radius: 5px;
  padding: 10px 20px;
  border: 2px solid #01a7e1;
  margin-bottom: 5px;
  cursor: pointer;
  font-family: Arial, Helvetica, sans-serif;
}

input[type="radio"] {
  display: none;
  position: absolute;
  width: 100%;
  appearance: none;
}

input[type="radio"]:checked+label {
  background: #01a7e1;
  color: #fff;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />
<div data-value="attending" class="radio-tempo col-sm-12">
  <input type="radio" id="button_yes" name="button_yes_no" value="yes" class="btn btn-default active" data-value="yes"><label for="button_yes"><i class="fa fa-smile-o"></i> Yes</label>
  <input type="radio"  name="button_yes_no" id="button_no" value="no" class="btn btn-default" data-value="no" /><label for="button_no"><i class="fa fa-frown-o"></i> No</label>
</div>

Вернуться на верх