how to Fix a Selenium Python Select Dropdown That Doesn’t Work
Problem:
Are you facing trouble with a Selenium Python select dropdown element that just won’t respond? You’re not alone. Many developers hit this wall when dropdowns are controlled by JavaScript or hidden with custom styling. In this tutorial, we’ll guide you on how to interact with such tricky elements using Selenium Python.
<div class="dataTables_length" id="indicators_length">
<label>
<span class="result-mune">
<span>Results </span>per page:
</span>
<select name="indicators_length" aria-controls="indicators" class="jcf-hidden">
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
<option value="200">200</option>
<option value="-1">All</option>
</select>
<span class="jcf-select jcf-unselectable">
<span class="jcf-select-text">
<span class="">25</span>
</span>
<span class="jcf-select-opener"></span>
</span>
</label>
</div>
the select element is not highlighted using the browser Inspect method, looks like this drop down is triggered by js. I tried to use the Select class described here:
select = Select(self._wait.until(EC.presence_of_element_located_by((By.XPATH, "//div[@id = 'indicators_length']//select[@name = 'indicators_length']")))
select.select_by_value('-1')When using Selenium WebDriver with Python, you might face an issue where the dropdown doesn’t respond to your usual Select class method. This happens often when the dropdown is customized or hidden by JavaScript libraries like jQuery or custom frontend frameworks. In this guide, we’ll show you how to bypass this problem by selecting the dropdown manually using XPath and execute_script.
Step-by-Step Working Solution:
1. Identify the visible clickable element
The actual <select> is hidden, and what’s shown is:
htmlCopyEdit<span class="jcf-select-text">
<span class="">25</span>
</span>
So, you’ll need to click on that and then choose the correct visible option.
2. Use Selenium to click on the custom dropdown and select value
# pythonCopyEditfrom selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.action_chains import ActionChains
import time
driver = webdriver.Chrome()
driver.get("YOUR_URL") # Replace with the actual page
wait = WebDriverWait(driver, 10)
# Step 1: Click the visible dropdown (custom one)
dropdown_toggle = wait.until(EC.element_to_be_clickable((By.CSS_SELECTOR, ".jcf-select")))
dropdown_toggle.click()
time.sleep(1) # Let the options load
# Step 2: Click the desired option (value = -1 = "All")
all_option = wait.until(EC.element_to_be_clickable((By.XPATH, "//span[contains(text(),'All')]")))
all_option.click()
Bonus Tip: Verify the Selection
After selecting, verify if the data or table is updated accordingly:
pythonCopyEdit# Wait for table/data to refresh
time.sleep(2)
rows = driver.find_elements(By.CSS_SELECTOR, "table#indicators tbody tr")
print(f"Total rows shown: {len(rows)}")
Why Select() Didn’t Work?
Select()only works with visible<select>elements.- Since this one is hidden (
class="jcf-hidden"), Selenium can’t interact with it directly. - You need to interact with the custom visible DOM rendered by JavaScript.
Best Practices:
- Use WebDriverWait over
time.sleep()for stability. - Add error handling and retry logic for flaky custom UIs.
- Inspect JavaScript-rendered elements using Chrome DevTools + live DOM.
Using this method, you can now reliably work with Selenium Python select dropdown elements—even when they are hidden or managed by JavaScript.