Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

424
Views
Deshabilitar botón con JS basado en opciones de selección

Necesito ayuda para deshabilitar/habilitar un botón basado en una opción de selección desplegable.

Estoy tratando de lograr dos cosas en una página de producto de Shopify y estoy a mitad de camino. Necesito crear una opción para que los clientes decidan si quieren comprar un producto complementario además del producto principal. Tengo un menú desplegable con tres opciones: Seleccionar, No y Sí. Cuando eligieron Sí, aparece el elemento con el producto. Esa parte está funcionando. Sin embargo, quiero deshabilitar el botón Agregar al carrito cuando la opción está en la opción predeterminada 'Seleccionar' para que se vean obligados a hacer una selección antes de que puedan agregar el artículo al carrito.

Aquí está el código hasta ahora. He intentado varias cosas basadas en búsquedas, pero parece que no puedo hacerlo bien. El botón Agregar al carrito se encuentra en un formulario separado justo encima del código del producto adicional.

 <form> <button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if settings.addto_btn_an %} btnzoom{% endif %}"> <span id="AddToCartText-{{ section.id }}"> Add To Cart </span> </button> </form> <script type="text/javascript"> function ShowHideDiv() { var pfa_option = document.getElementById("pfa_option"); var pfa_select = document.getElementById("pfa_select"); pfa_select.style.display = pfa_option.value == "Y" ? "block" : "none"; } </script> <span>Do you need a Print for Approval (PFA)?</span> <select required id="pfa_option" onchange="ShowHideDiv()"> <option value="S">Select</option> <option value="N">No</option> <option value="Y">Yes</option> </select> <hr /> <div id="pfa_select" style="display: none"> <div class=add-on-product-style> <form method="post" action="/cart/add"> <input type="hidden" name="id" value="41287631601846" /> <input type="hidden" value="1" id="quantity" name="quantity" /> Add Print for Approval +$25.00 &nbsp;&nbsp; <button type="submit" name="add" class="btn product-form__cart-submit">Add</button> <input type="hidden" name="return_to" value="back" /> </form> </div> </div>
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!