AnswerBun.com

Checkbox obrigatória ao apertar o botão

Stack Overflow em Português Asked by Vinícius Lodi on December 17, 2020

Eu gostaria de colocar uma checkbox obrigatória em html abaixo do botão de pagamento do meu site, gostaria que a pessoa só conseguisse continuar a compra se marcasse os termos de uso, caso contrário ele notifica que a pessoa não marcou a checkbox. Já tentei de tudo, não consigo, sou novo na área.

Meu botão de comprar:

            <button
         onclick="comprar('LINK DE PAGAMENTO')"
         class="plans-button"
         klickart-edit-not-highlight=""
         klickart-edit-link-type="default"
         klickart-edit-link-href-klickbox="#"
         klickart-edit-link-href-faq-question="#"
         id="klickart-linkikl6qk5g77k00"
         style="background-attachment: scroll; background-color: rgb(255, 64, 64);"
        >
         <span><b class="medium-b">QUERO ESSE PLANO!</b></span>
        </button>

Porém eu gostaria de colocar a checkbox abaixo do botão, nessa posição:

O código dessas escritas abaixo do botão é esse:

      <footer class="plans-info" id="klickart-collection-2cimijo2l8k000">
   <div class="info-item">
    <span class="icon-footer">
     <svg klickart-edit-icon="svg" enable-background="0 0 512 512" fill="#c0c0c0" viewbox="0 0 512 512">
      <path
       d="M436.064,77.014c-48.238-48.248-112.377-74.809-180.6-74.809c-68.221,0-132.36,26.561-180.599,74.809C26.623,125.25,0.056,189.388,0.056,257.61c0,68.223,26.567,132.36,74.809,180.597c48.238,48.237,112.378,74.807,180.599,74.807c68.223,0,132.362-26.57,180.6-74.807c48.242-48.237,74.809-112.375,74.809-180.597C510.873,189.388,484.305,125.25,436.064,77.014z M490.314,257.61c0,60.436-22.954,115.609-60.594,157.274L98.189,83.355c41.664-37.642,96.837-60.596,157.274-60.596C384.96,22.759,490.314,128.117,490.314,257.61z M20.615,257.61c0-61.677,23.913-117.868,62.938-159.818l331.726,331.733c-41.95,39.024-98.139,62.937-159.815,62.937C125.969,492.462,20.615,387.104,20.615,257.61z"
      ></path>
     </svg>
    </span>
    <span>Cancele seu plano <b class="medium-b">mensal</b> a qualquer momento e sem compromisso.</span>
   </div>
   <div class="info-item">
    <span class="icon-footer">
     <svg klickart-edit-icon="svg" fill="#c0c0c0" viewbox="0 0 512 512">
      <path
       d="M507.4 351.5l-64.6-64.6 10.7-12.3c8.2-9.5 12-25.8 8.7-37.9l-4.3-15.7c-1.6-5.7-1.6-16.5 0-22.2l4.3-15.7c3.3-12.2-0.4-28.4-8.7-37.9l-10.7-12.3c-3.9-4.5-8.6-14.2-9.6-20l-3-16c-2.3-12.4-12.7-25.4-24.2-30.4l-14.9-6.5c-5.4-2.4-13.9-9.1-17.3-13.8l-9.6-13.1c-7.1-9.7-21.6-16.9-33.7-16.9h-0.9l-16.8 0.7c-0.2 0-0.5 0-0.7 0 -6.1 0-15.8-2.3-20.8-5l-14.4-7.7c-5.4-2.9-12.3-4.5-19.4-4.5 -7.1 0-14 1.6-19.5 4.5l-14.3 7.7c-5 2.7-14.6 5-20.7 5 -0.3 0-0.5 0-0.9 0l-16.5-0.7c-0.3 0-0.7 0-1 0 -12.2 0-26.7 7.3-33.8 16.9l-9.6 13.1c-3.5 4.7-11.9 11.5-17.3 13.8l-15 6.5c-11.5 5-22 18.1-24.2 30.4l-3 16c-1.1 5.8-5.8 15.5-9.6 20l-10.6 12.3c-8.2 9.5-12 25.8-8.7 37.9l4.3 15.7c1.5 5.7 1.6 16.5 0 22.2l-4.3 15.7c-3.3 12.1 0.4 28.4 8.7 37.9l10.7 12.4 0.2 0.2L7.8 351.5c-5.9 6-8.3 14.2-6.3 22.1 2 7.9 8 14 16.1 16.5l64.5 19.2 19.2 64.5c3 10 11.8 16.8 22 16.8 6.2 0 12.1-2.5 16.6-7l77.9-78c2.3 0.7 4.3 1.5 5.8 2.3l14.4 7.7c5.4 2.9 12.3 4.4 19.5 4.4 7.2 0 14.1-1.6 19.4-4.4l14.4-7.7c1.6-0.9 3.8-1.7 6.2-2.4l78.1 78.1c4.5 4.5 10.4 7 16.6 7 10.2 0 19-6.7 22-16.7l19.2-64.5 64.5-19.2c8.1-2.4 14.1-8.6 16.1-16.5C515.7 365.7 513.3 357.5 507.4 351.5zM125.1 460.7l-19.8-66.3c-1.1-3.7-4.6-7.3-8.3-8.3l-66.4-19.8 52.2-52.2 1.6 8.9c2.3 12.4 12.7 25.4 24.2 30.4l15 6.5c5.4 2.3 13.8 9 17.3 13.8l9.6 13.1c6.6 9.1 19.9 16 31.6 16.8L125.1 460.7zM278.9 384.8l-14.4 7.7c-1.7 0.9-4.3 1.4-7.1 1.4 -2.8 0-5.5-0.5-7.1-1.4l-14.4-7.7c-1.4-0.7-2.8-1.4-4.2-1.9 -5.9-2.5-13.3-4.5-20.2-5.4 -3.1-0.5-6.1-0.7-8.8-0.7 -0.4 0-0.8 0-1.1 0h-0.6l-16.5 0.7h-0.2c-4.1 0-10.3-3.1-12.6-6.2l-9.6-13.1c-6.2-8.5-18.5-18.3-28.1-22.4l-14.9-6.5c-3.7-1.6-8.2-7.2-8.9-11.1l-3-16c-0.7-3.9-2.2-8.5-4.2-13.3 -3.1-7.4-7.3-14.3-11.4-19l-0.4-0.5 -10.3-11.9c-2.6-3-4.2-10-3.2-13.9l4.3-15.7c2.7-10 2.7-25.8 0-35.9l-4.3-15.7c-1-3.9 0.6-10.9 3.2-13.9l10.6-12.3c6.9-7.9 13.7-22.1 15.6-32.4l3-16c0.7-3.9 5.2-9.5 8.9-11.1l15-6.5c9.6-4.1 21.9-14 28.1-22.4l9.6-13.1c2.3-3.1 8.5-6.2 12.5-6.2h0.3l16.3 0.7c0.6 0 1.2 0.1 1.8 0.1 10.3 0 24.5-3.5 33.1-8l14.3-7.7c1.6-0.9 4.3-1.4 7.1-1.4 2.8 0 5.5 0.5 7.1 1.4l14.4 7.7c8.6 4.6 22.8 8.1 33.1 8.1 0.5 0 0.9 0 1.4 0h0.3l16.6-0.7h0.2c4 0 10.2 3.1 12.5 6.2l9.6 13.1c6.2 8.4 18.5 18.2 28.1 22.4l14.9 6.4c3.7 1.6 8.2 7.2 8.9 11.1l3 16c1.9 10.3 8.7 24.5 15.6 32.4l10.6 12.3c2.6 3 4.2 10 3.2 13.9l-4.3 15.7c-2.7 10.1-2.7 25.9 0 35.9l4.3 15.7c1 3.9-0.6 10.9-3.2 13.9l-10.3 11.8 -0.4 0.5c-6.8 7.9-13.7 22.1-15.6 32.4l-3 16c-0.7 3.9-5.2 9.5-8.9 11.1l-14.9 6.5c-9.6 4.1-21.9 14-28.1 22.4l-9.6 13.1c-2.3 3.1-8.5 6.2-12.5 6.2h-0.4l-16.3-0.7c-0.5 0-1.1 0-1.7 0 -8.7 0-20.4 2.4-29 6.1C281.6 383.4 280.2 384.1 278.9 384.8zM418.2 386c-3.7 1.1-7.2 4.6-8.3 8.3l-19.8 66.4 -57.2-57.2c11.6-0.9 24.6-7.8 31.1-16.8l9.6-13.1c3.5-4.8 11.9-11.5 17.3-13.8l15-6.5c11.5-5 22-18.1 24.2-30.4l1.7-9.3 52.6 52.6L418.2 386z"
      ></path>
     </svg>
    </span>
    <span>Satisfação garantida!</span>
   </div>
  </footer>
 </div>
</section>

One Answer

Adiciona o atributo required na tag html do campo que você deseja ser obrigatório

Exemplo:

<form action="#">
<input type="checkbox" name="myName" id="myId" required> Li e Concordo com os Termos de Licensa do Site
<br>
<br>
<input type="submit" value="Enviar">
</form>

Espero ter Ajudado

Answered by TheHatter on December 17, 2020

Add your own answers!

Related Questions

RecepcaoEvento 4.0 – Manifestação de NFe

1  Asked on November 13, 2021 by renan-pinheiro

   

Gravação Arquivo Oracle SQL

1  Asked on November 13, 2021 by paulo-camargo

     

Gravar último login por meio do mysql e exibir quem está online

1  Asked on November 13, 2021 by camila-domingues

   

Multiplicação de campos no Sequelize

1  Asked on November 13, 2021 by raphael-prado-de-oliveira

   

Como calculo o ângulo de um objeto em java?

1  Asked on November 10, 2021 by caique-dias

   

Criar botao play/pause

2  Asked on November 10, 2021 by leonardo-costa

       

Uso de struct no C#

2  Asked on November 10, 2021 by arthur-luiz

         

Problema na compilação de string em C

2  Asked on November 10, 2021 by daniel-saldanha

       

Ask a Question

Get help from others!

© 2022 AnswerBun.com. All rights reserved. Sites we Love: PCI Database, MenuIva, UKBizDB, Menu Kuliner, Sharing RPP