Как реализовать валидацию на размер, при добавлении товара в корзину?

Подскажите, как дописать JS для отправки товара в корзину? Хочу добавить валидацию: если размер не выбран, выводилось бы сообщение - "выберите размер". Ну и не происходила бы отправка, та что я сделал в примере.

Хочу выводить ошибку в классе ax-result.

Сам скрипт отправки по кнопке я сделал (на сайте работает), а вот валидацию в скрипт не смог внедрить. По идее, сначала должна срабатывать валидация, и если размер выбран, то всё о’кей, и товар уходит.

Что касаемо <select>, то у меня там заглушка - <option>Выбрать размер</option> без value. Не будет ли считаться это выбором? Если будет, то как сделать, чтобы не считалось?

jQuery(document).ready(function() {
  //добавить товар в корзину
  jQuery(document).on("click", '.faddtov', function() {
    if (!jQuery(this).hasClass('active')) {
      var $this = this;

      price = $($this).parents('.ftovrp').find('.getPrice').data('price');
      qty = $($this).parents('.ftovr').find('.fkolvo').val();
      razmer = $($this).parents('.ftovr').find('#tovrazmer').val();
      product_id = jQuery($this).data('id');

      var data = {};
      data.price = price;
      data.product_id = product_id;
      data.qty = qty;
      data.razmer = razmer;

      jQuery.ajax({
        url: 'https://' + location.host + '/ax/cart/addtov',
        type: 'POST',
        dataType: 'json',
        data: { data: data },
        success: function(data) {
          if (data.qty > 0) {
            console.log($("#basket"));
            $("#basket").removeClass("empty");
          }

          totNum = number_format(data.total, 0, '.', ' ');

          var drob = String(Math.round((data.total - Math.floor(data.total)) * 100));
          if (drob.length < 2) {
            drob = '0' + drob;
          }

          jQuery('.basket').html('<i class="icon-corz"></i><span>' + data.qty + '</span>');
          jQuery($this).addClass('active').html('<i class="icon-addcorz"></i>В корзине');
          window.location.hash = '#win3';
        }
      });
      return false;
    }
  });
});
.ftovrp {
  margin: 30px;
}

.ftov {
  margin-top: 70px;
}

.ftovl {
  width: 60%;
  margin-right: 70px;
}

.ftovr {
  width: 40%;
  position: relative;
}

.ftovr h1,
.ftovl h1 {
  font-size: 16px;
  margin: -5px 0 10px 0;
  color: #282725;
}

.ftovl h1 {
  margin: -5px 0 15px 0;
  border-bottom: none;
  padding-bottom: 0;
  display: none;
}

.ftovbf {
  width: 80%;
  position: relative;
}

.ftovbf img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}

.ftovmf {
  width: 20%;
  margin-left: 20px;
}

.ftovrp b {
  font-weight: 400;
  color: #7b7f88;
  display: block;
  margin-bottom: 5px;
}

.bl4 strong {
  color: #282725;
  font-weight: 400;
}

.fltr {
  display: block;
  color: #5db6b4;
  margin-bottom: 15px;
}

.fltr:hover {
  color: #282725;
}

.faddtov {
  display: inline-block;
  min-width: 140px;
  height: 55px;
  line-height: 55px;
  background: #6FC4C3;
  color: #fff;
  text-align: center;
  border-radius: 3px;
  font-weight: 600;
}

.faddtov:hover {
  background: #282725;
}

.faddtov.active {
  background: #282725;
  cursor: default;
}

.getPrice {
  margin-bottom: 70px;
}

.getPrice b {
  width: 50%;
}

.sprs strong {
  font-size: 20px;
  color: #FF2525;
  font-weight: 600;
  font-family: 'arial', sans-serif;
}

.sprs strong span {
  font-size: 14px;
  color: #282725;
  font-weight: 400;
  margin-right: 5px;
}

.proz {
  position: relative;
  opacity: 0.4;
  -moz-opacity: 0.4;
  filter: alpha(opacity=40);
}

.proz:before {
  border-bottom: 2px solid #818181;
  position: absolute;
  content: "";
  width: 20%;
  height: 65%;
  transform: rotate(-12deg);
  margin-left: -2px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<div class="ftovrp">
  <h2>Название товара</h2>
  <br/>
  <b class="bl4">Артикул:<strong> 199956</strong></b>
  <b class="bl4">Производитель:<strong> Россия</strong></b>
  <a href="#win4" title="" class="fltr">Подобрать свой точный размер</a>
  <div class="fltce">
    <select name="tovrazmer" id="tovrazmer" class="js-select2">
      <option>Выбрать размер</option>
      <option value="S">S</option>
      <option value="L">L</option>
      <option value="XL">XL</option>
      <option value="XXL">XXL</option>
    </select>
  </div>
  <br/>
  <b class="bl4 colortov">Цвет:<strong> темно-синий</strong></b>
  <div class="getPrice">
    <b class="sprs proz">Цена<br /> <strong class="fsum">1 000<span>,00 ₽</span></strong></b>
    <b class="sprs">Цена со скидкой<br /><strong class="fsuma">800<span>,00 ₽</span></strong></b>
    <br/>
    <a href="javascript:void(0)" class="faddtov"><i class="icon-addcorz"></i>В корзину</a>
  </div>
  <div class="ax-result"></div>
</div>


Ответы (1 шт):

Автор решения: ws17

Решение:

$('.ax-result').addClass('validerror').html('Выберите размер');

→ Ссылка