Obrigatorio preenchimento da Variação Texto de um produto no Ato da Compra



  • Criei uma variação com campo texto em um determinado produto onde a pessoa deve digitar uma informação ao realizar a compra. Porém se a pessoa não colocar essa informação no campo texto ela ainda consegue efetuar a compra.
    Existe uma forma de ser obrigatório o preenchimento deste campo antes que a pessoa finalize a compra?


  • Dev

    Olá @grudes, eu fiz um pequeno código em cima de uma validação das variações para tentar fazer um bloqueio da compra na validação em relação ao campo do input que fica em branco, então faz o teste e ver se é isso mesmo.



  • Oi Charles obrigada pela correção, deu certo sim porém o ajuste ocasionou outro problema.
    Parou de funcionar a visualização do preço do produto quando troco a quantidade selecionada que é uma outra variação criada no formato de opções.
    Para exemplificar, criei 2 variações de quantidade: Kit com 100 unidades por um valor e Kit com 150 unidades com outro valor, quando clico em qualquer uma das opções de quantidade o preço total do produto desaparece, só mostra as opções de parcelamento.


  • Dev

    @grudes, não foi a alteração que fiz que causou isso, o problema já tava assim, eu simplesmente fui no Editar layout e depois cliquei na aba COR e fui na seção de página do produto e mudei a cor do preço para preto que antes estava BRANCO, agora está tudo certinho. Pode dar uma verificada.



  • Deu certo, muito obrigada.



  • @charles Olá Charles tudo bem? Você havia feito um código para que houvesse um bloqueio na compra caso os campos de texto que são obrigatórios não fossem preenchidos, porém não está funcionando mais. Todos os novos produtos que criei deixa a pessoa concretizar a compra sem preencher esses campos de texto. Como devo proceder?


  • Dev

    Olá @grudes, fiz a nova correção lá, pode fazer os testes se está indo.



  • Olá, consegue compartilhar o código?


  • Dev

    Olá @Raphael-Sarmento, sim claro, mas vai ter que adaptá-lo no seu código, o que vou te passar vai ter dar uma idéia do funcionamento:

    Print de como vai ficar:

    0_1543427732312_Deepin Screenshot_selecionar área_20181128155438.png

    Código do print:

    {% set count = 1 %}
        	          			{% for option in options %}
                                    {% if option.id in product.available_options and option.type == 'textfield' %}
        	          			        var input_{{count}} = $('input[name="option[{{ option.id }}]"]');
        	          			        {% set count = count + 1 %}
        	          			    {% endif %}
            	          		{% endfor %}
            	          		
            	          		
            	          		$(function(){
            	          		    if($('.form-control').hasClass('teste')){
            	          			    
            	          			    $('.prod-variant-btn').click(function(){
            	          			        setTimeout(function(){
            	          			            $('.buy-btn').addClass('buy-btn-disabled');    
            	          			        }, 800);
            	          			    });
            	          			    
            	          			    $(input_1).keyup(function(){
            	          			        if(input_1.val() == ''){
            	          			            console.log('preencher campo 1');
                	          			        $('.buy-btn').addClass('buy-btn-disabled');
            	          			        }else if(input_1.val() != '' && input_2.val() == ''){
            	          			            console.log('preencher campo 2');
                	          			        $('.buy-btn').addClass('buy-btn-disabled');
                	          			    }else{
                	          			        $('.buy-btn').removeClass('buy-btn-disabled');
                	          			    }
            	          			    });
            	          			    
            	          			    $(input_2).keyup(function(){
            	          			        if(input_2.val() == ''){
                	          			        console.log('preencher campo 2');
                	          			        $('.buy-btn').addClass('buy-btn-disabled');
            	          			        }else if(input_1.val() == '' && input_2.val() != ''){
            	          			            console.log('preencher campo 1');
                	          			        $('.buy-btn').addClass('buy-btn-disabled');
                	          			    }else{
                	          			        $('.buy-btn').removeClass('buy-btn-disabled');
                	          			    }
            	          			    });
                	          		}
            	          		});