How do you get a size validation when you add the product to the basket?
-
Can you tell me how to finish the JS to send the goods to the basket? I'd like to add a validation: if the size was not chosen, the message would be "size the size." Well, there wouldn't be a shipment that I did in the example.
I want to make a mistake in class. ax-result♪
I've done the squeaking on the button myself, and I haven't been able to infiltrate the evidence. I think it should be the first time that the Validation works, and if the size is chosen, it's all o'ckey and the goods go.
What is touched
<select>
I've got a lipstick.<option>Выбрать размер</option>
freevalue
♪ Would that be a choice? If it does, how do you not count?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>
-
Decision:
$ '.ax-result'.addClass('validerror').html.