Conditional Drop-Down

  • Resolved mtlvibe

    (@mtlvibe)


    8 years, 1 month ago

    Hi I wanted to write a script (Conditional Logic) whether in ajax or jquery which allows the first drop-down to populate the subsequent drop downs based on the selection made. Where can I intercept the selection made from the first drop down. Can you please direct me to the php page.

    https://eventon.ca/product/la-grande-duo-25-roses/

    `
    ### WordPress Environment ###

    Home URL: https://eventon.ca
    Site URL: https://eventon.ca
    WC Version: 2.6.11
    Log Directory Writable: ?
    WP Version: 4.7
    WP Multisite: –
    WP Memory Limit: 256 MB
    WP Debug Mode: –
    WP Cron: ?
    Language: en_US

    ### Server Environment ###

    Server Info: Apache
    PHP Version: 7.0.13
    PHP Post Max Size: 20 MB
    PHP Time Limit: 30
    PHP Max Input Vars: 1000
    cURL Version: 7.19.7
    OpenSSL/1.0.0

    SUHOSIN Installed: –
    MySQL Version: ? 5.5.53 – We recommend a minimum MySQL version of 5.6. See: WordPress Requirements
    Max Upload Size: 20 MB
    Default Timezone is UTC: ?
    fsockopen/cURL: ?
    SoapClient: ?
    DOMDocument: ?
    GZip: ?
    Multibyte String: ?
    Remote Post: ?
    Remote Get: ?

    ### Database ###

    WC Database Version: 2.6.11
    :
    woocommerce_sessions: ?
    woocommerce_api_keys: ?
    woocommerce_attribute_taxonomies: ?
    woocommerce_downloadable_product_permissions: ?
    woocommerce_order_items: ?
    woocommerce_order_itemmeta: ?
    woocommerce_tax_rates: ?
    woocommerce_tax_rate_locations: ?
    woocommerce_shipping_zones: ?
    woocommerce_shipping_zone_locations: ?
    woocommerce_shipping_zone_methods: ?
    woocommerce_payment_tokens: ?
    woocommerce_payment_tokenmeta: ?
    MaxMind GeoIP Database: ?

    ### Active Plugins (9) ###

    LayerSlider WP: by Kreatura Media – 6.1.0
    Advanced Custom Fields: Repeater Field: by Elliot Condon – 1.1.1
    Advanced Custom Fields: by Elliot Condon – 4.4.11
    Akismet: by Automattic – 3.2
    Child Theme Configurator: by Lilaea Media – 2.2.1
    Envato Market: by Derek Herman – 1.0.0-RC2
    WPBakery Visual Composer: by Michael M – WPBakery.com – 5.0.1
    WooCommerce: by WooThemes – 2.6.11
    WP-clone-template: by Sergio Milardovich – 2.0

    ### Settings ###

    Force SSL: –
    Currency: CAD ($)
    Currency Position: left
    Thousand Separator: ,
    Decimal Separator: .
    Number of Decimals: 2

    ### API ###

    API Enabled: ?

    ### WC Pages ###

    Shop Base: #4 – /shop/
    Cart: ? Page not set
    Checkout: ? Page not set
    My Account: ? Page not set

    ### Taxonomies ###

    Product Types: external (external)
    grouped (grouped)
    simple (simple)
    variable (variable)

    ### Theme ###

    Name: Aurum V2.9.5
    Version: 2.9.5
    Author URL: https://laborator.co/
    Child Theme: ? – If you’re modifying WooCommerce on a parent theme you didn’t build personally
    then we recommend using a child theme. See: How to create a child theme

    WooCommerce Support: ?

    ### Templates ###

    Overrides: mfleursmtl/woocommerce/archive-product.php
    mfleursmtl/woocommerce/cart/cart-empty.php
    mfleursmtl/woocommerce/cart/cart-shipping.php
    mfleursmtl/woocommerce/cart/cart.php
    mfleursmtl/woocommerce/cart/cross-sells.php
    mfleursmtl/woocommerce/cart/shipping-calculator.php
    mfleursmtl/woocommerce/checkout/form-billing.php
    mfleursmtl/woocommerce/checkout/form-checkout.php
    mfleursmtl/woocommerce/checkout/form-login.php
    mfleursmtl/woocommerce/checkout/form-pay.php
    mfleursmtl/woocommerce/checkout/form-shipping.php
    mfleursmtl/woocommerce/checkout/review-order.php
    mfleursmtl/woocommerce/checkout/thankyou.php
    mfleursmtl/woocommerce/content-product.php
    mfleursmtl/woocommerce/content-product_cat.php
    mfleursmtl/woocommerce/content-single-product.php
    mfleursmtl/woocommerce/global/form-login.php
    mfleursmtl/woocommerce/global/wrapper-end.php
    mfleursmtl/woocommerce/global/wrapper-start.php
    mfleursmtl/woocommerce/loop/add-to-cart.php
    mfleursmtl/woocommerce/loop/loop-end.php
    mfleursmtl/woocommerce/loop/loop-start.php
    mfleursmtl/woocommerce/loop/no-products-found.php
    mfleursmtl/woocommerce/loop/orderby.php
    mfleursmtl/woocommerce/loop/pagination.php
    mfleursmtl/woocommerce/loop/price.php
    mfleursmtl/woocommerce/loop/rating.php
    mfleursmtl/woocommerce/loop/result-count.php
    mfleursmtl/woocommerce/loop/sale-flash.php
    mfleursmtl/woocommerce/myaccount/form-edit-account.php
    mfleursmtl/woocommerce/myaccount/form-edit-address.php
    mfleursmtl/woocommerce/myaccount/form-login.php
    mfleursmtl/woocommerce/myaccount/form-lost-password.php
    mfleursmtl/woocommerce/myaccount/form-reset-password.php
    mfleursmtl/woocommerce/myaccount/my-account.php
    mfleursmtl/woocommerce/myaccount/my-address.php
    mfleursmtl/woocommerce/myaccount/my-downloads.php
    mfleursmtl/woocommerce/myaccount/orders.php
    mfleursmtl/woocommerce/myaccount/view-order.php
    mfleursmtl/woocommerce/order/form-tracking.php
    mfleursmtl/woocommerce/order/order-details-customer.php
    mfleursmtl/woocommerce/order/order-details-item.php
    mfleursmtl/woocommerce/order/order-details.php
    mfleursmtl/woocommerce/order/tracking.php
    mfleursmtl/woocommerce/single-product/add-to-cart/grouped.php
    mfleursmtl/woocommerce/single-product/add-to-cart/variable.php
    mfleursmtl/woocommerce/single-product/meta.php
    mfleursmtl/woocommerce/single-product/price.php
    mfleursmtl/woocommerce/single-product/product-image.php
    mfleursmtl/woocommerce/single-product/product-thumbnails.php
    mfleursmtl/woocommerce/single-product/rating.php
    mfleursmtl/woocommerce/single-product/review-meta.php
    mfleursmtl/woocommerce/single-product/review-rating.php
    mfleursmtl/woocommerce/single-product/review.php
    mfleursmtl/woocommerce/single-product/sale-flash.php
    mfleursmtl/woocommerce/single-product/tabs/additional-information.php
    mfleursmtl/woocommerce/single-product/tabs/description.php
    mfleursmtl/woocommerce/single-product/tabs/tabs.php
    mfleursmtl/woocommerce/single-product/title.php
    mfleursmtl/woocommerce/single-product-reviews.php
    mfleursmtl/woocommerce/single-product.php

    `

    • This topic was modified 8 years, 1 month ago by mtlvibe.
Viewing 15 replies - 1 through 15 (of 18 total)

  • At first you need to know about wordpress ajax hooks and jQuery ajax and onChange event.

    check WP AJAX with jQuery post

    when you hit the ajax function extract your $_POST values and populate another <select> and return it to your script for appending it into the DOM

    Plugin Support RK a11n

    (@riaanknoetze)

    which allows the first drop-down to populate the subsequent drop downs based on the selection made

    If that’s for variable products, WooCommerce already works that way ??

    If it’s for a custom form to add product conditional add-on type selections, why not simply use https://woocommerce.com/products/gravity-forms-add-ons/ ?

    Thread Starter mtlvibe

    (@mtlvibe)

    Hey Rafsuntaskin, any simple tutorials you know of how to implement hooks for beginners?

    Riaan does the Gravity form have simple conditional hierarchical logic for drop downs?

    In case you don’t have to utilize database, that is if you can print all your Primary and secondary options in a single page then you can use this jQuery plugin :

    https://www.appelsiini.net/projects/chained

    just create your custom function to print all the select as shown in the above link and add the scripts as needed.

    Thread Starter mtlvibe

    (@mtlvibe)

    Hi rafsuntaskin, I dont require the database however Im not sure how i can add this to the woocommerece single product page ? Is it through hooks and if so what function is needed to be called?

    After you have written your JavaScript, you can load it into the page this way:

    add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
  wp_enqueue_script( 'my-js', '/wp-content/uploads/my_script.js', array(), "1", true);
}

    I understand what you want to do but I am interested to know why you want to do it. Is it because some combinations are not available and customers are getting an annoying message when selecting one? If so, that’s a regular issue on the forum and there is a suggested fix for it.

    Thread Starter mtlvibe

    (@mtlvibe)

    Hi Lorro, I just want to be able to display a set A or B to the user from a previous drop down selection (so yes a combination), whether that be through chained selects or even a hide/unhide drop downs. I was looking for a plugins if they already existed, but i haven’t found much, is there any solution you are aware of?

    • This reply was modified 8 years, 1 month ago by mtlvibe.

    WooCommerce already works this way for variable products. You can setup multiple sets of attributes and WC will show a corresponding dropdown for each set of attributes.

    Thread Starter mtlvibe

    (@mtlvibe)

    Hi Lorro, its just that the first dropdown is linked to varations to the other two dropdowns. This means with woocommerece i have over 100 varations to select.
    https://eventon.ca/product/la-grande-duo-25-roses/

    That product is out of stock so I can’t see what its like.

    Thread Starter mtlvibe

    (@mtlvibe)

    Hi Lorro please try again I added in the stock https://eventon.ca/product/la-grande-duo-25-roses/ if i was suppose to created it through woocomm i would need 657 variations listed

    Is the problem then that you don’t want to have to make 657 variations?

    That’s understandable, I’m just trying to get a grasp of the problem.

    Thread Starter mtlvibe

    (@mtlvibe)

    Yes since its an option on several products and it would be hard to manage. Thats why im looking to an alternative solution.

    Yes it would be hard to manage.

    Well the easiest way is to set up just one variation, but when you do so make sure each of the 4 attribute selectors is set to “Any”.

    The disadvantages of this method are: that individual variations cannot have their own SKU identifier, you cannot have stock control at variation level and each variation must have the same price.

    You can use a hybrid approach, so if for example your fresh rose product was one price and the eternal rose option a different price, you would have 2 variations:
    Variation #1: Fresh Any Any Any
    Variation #2: Eternal Any Any Any

    • This reply was modified 8 years, 1 month ago by lorro.
    Thread Starter mtlvibe

    (@mtlvibe)

    Hi Lorro the variaitons are like

    Variation #1: Fresh Set1 Set1 $100
    Variation #2: Eternal Set2 Set2 $100

    its the rose colors that are the issues. The sku can remain the same however the price is only dependent on the the rose type.

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Conditional Drop-Down’ is closed to new replies.