I am having a problem with the way the State drop down populates within my Salient/WooCommerce cart checkout. When you click on the down arrow to choose the State (pretty much any browser, desktop or mobile) no states populate - just an empty box that partially covers the fields below. I narrowed the issue down to the Salient theme by temporarily changing the theme, which changes the format of the checkout page/fields and allows the drop down to work as it should. I found a patch that instructed me to put the following CSS Code at the bottom of the General page within the Salient Tab on my dashboard.
.woocommerce form .form-row .select2-container { display: none; } .woocommerce form .form-row .select2-container~select { display: inline !important; }
This CSS Code is there now and if you place a product in my cart and try to check out you will see this on the checkout page...a second state drop down to appears right below the original state drop down box, causing confusion. To further complicate matters, if you click on the down and up arrow from the original state box instead of the 'second' one added by the CSS Code you will lock up the checkout page.
Does anybody have any insight on how I can fix this? I hate to go through the trouble of changing themes over this, but orders have stopped coming in since this was brought to our attention. I was hoping the CSS fix would work, but it hasn't. Does anybody have any other insight? The site can be found at http://www.extractconsultants.com
I am having a problem with the way the State drop down populates within my Salient/WooCommerce cart checkout. When you click on the down arrow to choose the State (pretty much any browser, desktop or mobile) no states populate - just an empty box that partially covers the fields below. I narrowed the issue down to the Salient theme by temporarily changing the theme, which changes the format of the checkout page/fields and allows the drop down to work as it should. I found a patch that instructed me to put the following CSS Code at the bottom of the General page within the Salient Tab on my dashboard.
.woocommerce form .form-row .select2-container { display: none; } .woocommerce form .form-row .select2-container~select { display: inline !important; }
This CSS Code is there now and if you place a product in my cart and try to check out you will see this on the checkout page...a second state drop down to appears right below the original state drop down box, causing confusion. To further complicate matters, if you click on the down and up arrow from the original state box instead of the 'second' one added by the CSS Code you will lock up the checkout page.
Does anybody have any insight on how I can fix this? I hate to go through the trouble of changing themes over this, but orders have stopped coming in since this was brought to our attention. I was hoping the CSS fix would work, but it hasn't. Does anybody have any other insight? The site can be found at http://www.extractconsultants.com
Thanks!
Kurt
Hey,
ThemeNectar Support Team
Tahir,
This resolved my issue!! Thank you so much for your quick response!
Kurt