WooCommerce: How to automatically select variation attribute dropdown field when there is only 1 option?
So I feel like this isn't too complicated of a request, but I simply can't figure it out. On my WooCommerce site, I have some variable products. There are 3 dropdown variation attributes in the following order (top to bottom): Color, Type, and Part Number. Each variation has a unique part number (only 1 part number per combination), so there is literally no need for the user to select the part number after they have chosen color & type. However, I need that part number to display for purposes of my product feed and so the customer can see the part number they have chosen by the previous 2 options.
My question is; since selecting a "Color" and "Type" narrows the final field ("Part number") down to only 1 option, how do I instruct WooCommerce to automatically select the single "part number" option that's available?
variables woocommerce conditional product variations
asked Nov 16 '18 at 9:45
wooq123wooq123
13
add a comment |
So I feel like this isn't too complicated of a request, but I simply can't figure it out. On my WooCommerce site, I have some variable products. There are 3 dropdown variation attributes in the following order (top to bottom): Color, Type, and Part Number. Each variation has a unique part number (only 1 part number per combination), so there is literally no need for the user to select the part number after they have chosen color & type. However, I need that part number to display for purposes of my product feed and so the customer can see the part number they have chosen by the previous 2 options.
My question is; since selecting a "Color" and "Type" narrows the final field ("Part number") down to only 1 option, how do I instruct WooCommerce to automatically select the single "part number" option that's available?
variables woocommerce conditional product variations
asked Nov 16 '18 at 9:45
wooq123wooq123
13
You can select default variation value while adding variations.
– Ahmad Hassan
Nov 16 '18 at 22:32
Yep, I've done that, but for all of the other combinations, the user will be required to select every option before being able to "add to cart". I want to essentially be able to set a locked in "part number" for each "color" and "type" combination. I want to arrange it so that the customer never has to manually select the "part number" field.
– wooq123
Nov 16 '18 at 23:50
Anyone have any ideas? Is there a js file with some simple script I can add to make the drop down select the only option automatically?
– wooq123
Nov 17 '18 at 21:22
add a comment |
So I feel like this isn't too complicated of a request, but I simply can't figure it out. On my WooCommerce site, I have some variable products. There are 3 dropdown variation attributes in the following order (top to bottom): Color, Type, and Part Number. Each variation has a unique part number (only 1 part number per combination), so there is literally no need for the user to select the part number after they have chosen color & type. However, I need that part number to display for purposes of my product feed and so the customer can see the part number they have chosen by the previous 2 options.
My question is; since selecting a "Color" and "Type" narrows the final field ("Part number") down to only 1 option, how do I instruct WooCommerce to automatically select the single "part number" option that's available?
variables woocommerce conditional product variations
asked Nov 16 '18 at 9:45
wooq123wooq123
13
So I feel like this isn't too complicated of a request, but I simply can't figure it out. On my WooCommerce site, I have some variable products. There are 3 dropdown variation attributes in the following order (top to bottom): Color, Type, and Part Number. Each variation has a unique part number (only 1 part number per combination), so there is literally no need for the user to select the part number after they have chosen color & type. However, I need that part number to display for purposes of my product feed and so the customer can see the part number they have chosen by the previous 2 options.
My question is; since selecting a "Color" and "Type" narrows the final field ("Part number") down to only 1 option, how do I instruct WooCommerce to automatically select the single "part number" option that's available?
variables woocommerce conditional product variations
variables woocommerce conditional product variations
asked Nov 16 '18 at 9:45
wooq123wooq123
13
asked Nov 16 '18 at 9:45
wooq123wooq123
13
asked Nov 16 '18 at 9:45
wooq123wooq123
13
asked Nov 16 '18 at 9:45
wooq123wooq123
13
asked Nov 16 '18 at 9:45
wooq123wooq123
13
13
You can select default variation value while adding variations.
– Ahmad Hassan
Nov 16 '18 at 22:32
Yep, I've done that, but for all of the other combinations, the user will be required to select every option before being able to "add to cart". I want to essentially be able to set a locked in "part number" for each "color" and "type" combination. I want to arrange it so that the customer never has to manually select the "part number" field.
– wooq123
Nov 16 '18 at 23:50
Anyone have any ideas? Is there a js file with some simple script I can add to make the drop down select the only option automatically?
– wooq123
Nov 17 '18 at 21:22
add a comment |
You can select default variation value while adding variations.
– Ahmad Hassan
Nov 16 '18 at 22:32
Yep, I've done that, but for all of the other combinations, the user will be required to select every option before being able to "add to cart". I want to essentially be able to set a locked in "part number" for each "color" and "type" combination. I want to arrange it so that the customer never has to manually select the "part number" field.
– wooq123
Nov 16 '18 at 23:50
Anyone have any ideas? Is there a js file with some simple script I can add to make the drop down select the only option automatically?
– wooq123
Nov 17 '18 at 21:22
You can select default variation value while adding variations.
– Ahmad Hassan
Nov 16 '18 at 22:32
You can select default variation value while adding variations.
– Ahmad Hassan
Nov 16 '18 at 22:32
Yep, I've done that, but for all of the other combinations, the user will be required to select every option before being able to "add to cart". I want to essentially be able to set a locked in "part number" for each "color" and "type" combination. I want to arrange it so that the customer never has to manually select the "part number" field.
– wooq123
Nov 16 '18 at 23:50
Yep, I've done that, but for all of the other combinations, the user will be required to select every option before being able to "add to cart". I want to essentially be able to set a locked in "part number" for each "color" and "type" combination. I want to arrange it so that the customer never has to manually select the "part number" field.
– wooq123
Nov 16 '18 at 23:50
Anyone have any ideas? Is there a js file with some simple script I can add to make the drop down select the only option automatically?
– wooq123
Nov 17 '18 at 21:22
Anyone have any ideas? Is there a js file with some simple script I can add to make the drop down select the only option automatically?
– wooq123
Nov 17 '18 at 21:22
add a comment |
1 Answer
1
active
oldest
votes
You can do this with JS:
jQuery('a.toggle_component').click(function(e){
if(!(jQuery(e.target).parents('.component').find('select.component_options_select > option[selected=selected]').val())) {
jQuery(e.target).parents('.component').find('select.component_options_select > option:nth-child(2)').attr('selected','selected');
jQuery(e.target).parents('.component').find('select.component_options_select').change();
}
});
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53335179%2fwoocommerce-how-to-automatically-select-variation-attribute-dropdown-field-when%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can do this with JS:
jQuery('a.toggle_component').click(function(e){
if(!(jQuery(e.target).parents('.component').find('select.component_options_select > option[selected=selected]').val())) {
jQuery(e.target).parents('.component').find('select.component_options_select > option:nth-child(2)').attr('selected','selected');
jQuery(e.target).parents('.component').find('select.component_options_select').change();
}
});
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
add a comment |
You can do this with JS:
jQuery('a.toggle_component').click(function(e){
if(!(jQuery(e.target).parents('.component').find('select.component_options_select > option[selected=selected]').val())) {
jQuery(e.target).parents('.component').find('select.component_options_select > option:nth-child(2)').attr('selected','selected');
jQuery(e.target).parents('.component').find('select.component_options_select').change();
}
});
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
add a comment |
You can do this with JS:
jQuery('a.toggle_component').click(function(e){
if(!(jQuery(e.target).parents('.component').find('select.component_options_select > option[selected=selected]').val())) {
jQuery(e.target).parents('.component').find('select.component_options_select > option:nth-child(2)').attr('selected','selected');
jQuery(e.target).parents('.component').find('select.component_options_select').change();
}
});
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
You can do this with JS:
jQuery('a.toggle_component').click(function(e){
if(!(jQuery(e.target).parents('.component').find('select.component_options_select > option[selected=selected]').val())) {
jQuery(e.target).parents('.component').find('select.component_options_select > option:nth-child(2)').attr('selected','selected');
jQuery(e.target).parents('.component').find('select.component_options_select').change();
}
});
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
edited Dec 12 '18 at 20:49
Floern
27.4k1585102
27.4k1585102
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
answered Dec 12 '18 at 20:04
Viking MannViking Mann
12
12
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53335179%2fwoocommerce-how-to-automatically-select-variation-attribute-dropdown-field-when%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
You can select default variation value while adding variations.
– Ahmad Hassan
Nov 16 '18 at 22:32
Yep, I've done that, but for all of the other combinations, the user will be required to select every option before being able to "add to cart". I want to essentially be able to set a locked in "part number" for each "color" and "type" combination. I want to arrange it so that the customer never has to manually select the "part number" field.
– wooq123
Nov 16 '18 at 23:50
Anyone have any ideas? Is there a js file with some simple script I can add to make the drop down select the only option automatically?
– wooq123
Nov 17 '18 at 21:22