How to select dropdown in the dynamic table Selenium webdriver

Question

I have HTML tables like

<table id='table1'>
<tbody>
    <tr>
        <td colspan='2'>Food</td>
    </tr>
    <tr>
        <td>Burger</td>
        <td>
            <select class="form-control input-sm" id="xx2" onchange="count(this)">
                <option value="1">Burger</option>
                <option value="2">spaghetti</option>
                <option value="3">Kebab</option>
            </select>
        </td>
    </tr>       
    <tr>
        <td colspan='2'>Drink</td>
    </tr>
    <tr>
        <td>Burger</td>
        <td>
            <select class="form-control input-sm" id="kj2" onchange="count(this)">
                <option value="1">Coffe</option>
                <option value="2">Tea</option>
                <option value="3">Milk</option>
            </select>
        </td>
    </tr>
    <tr>
        <td colspan='2'> ... </td>
    </tr>
    <tr>
        <td> .......... </td>
        <td>
            <select class="form-control input-sm" id="jj" onchange="count(this)">
                <option value="1"> ... </option>
                <option value="2"> ..... </option>
                <option value="3"> .... </option>
            </select>
        </td>
    </tr>       
</tbody>

In selenium web driver, how to select first value at dropdownlist in the dynamic table (total rows is varry and there is colspan)

I have get table, and I want to get all and fill dropdownlist in the table

WebDriverWait(driver, 10).until(EC.presence_of_element_located((By.XPATH, '//*[@id="table1"]/tbody')))    
table = driver.find_element(By.XPATH, '//*[@id="table1"]/tbody')

fazriachyar · Answer 1 · 2023-02-02T03:32:02.440

0

to get all vary data

from bs4 import BeautifulSoup
import requests
  
main_site = requests.get("http://yourhtmlfile.html")
soup = BeautifulSoup(main_site.content, 'html.parser')
table = soup.find(attrs={'id':'table1'})
select = table.find(attrs={'id':'xx2'})
res = []
for option in select.find_all('option'):
    res.append(option["value"])

all option data is stored into res list

selectedDropDownList = Select(driver.find_element(By.ID, "xx2"))
selectedDropDownList.select_by_visible_text(res[0])

so, you can repeat this method to fullfill all dropdownlist

edited Feb 02 '23 at 03:32

answered Feb 02 '23 at 03:04

fazriachyar

1
2

how to get element ID in each dropdown in the table? because element ID is vary – jack Feb 02 '23 at 03:15
you can use beautifulSoup to do that,i have edit my answer – fazriachyar Feb 02 '23 at 03:22

score 0 · Answer 2 · answered Feb 02 '23 at 07:47

You can use the below XPath:

To select the first dropdown:

dropdown_1 = Select(driver.find_element(By.XPATH, "(.//*[@id='table1']//select[@class='form-control input-sm'])[1]"))

To select the second or third dropdown you can change the index in the XPath:

(.//*[@id='table1']//select[@class='form-control input-sm'])[2]

or

(.//*[@id='table1']//select[@class='form-control input-sm'])[3]

To select the first option from the dropdown:

dropdown_1.select_by_value(1)

or

dropdown_1.select_by_index(0)

score 0 · Answer 3 · answered Feb 02 '23 at 09:50

Based on your html structure, you can use item reference like food or drink and then target following select element.

Use following xpath to identify each dropdown element.

dropdwon 1: "//td[text()='Food']/following::select[1]"

dropdwon 2: "//td[text()='Drink']/following::select[1]"

Use selenium select class to select the drop down values. To handle dynamic element use WebDriverWait() and want for element clickable.

selectFood=Select(WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"//td[text()='Food']/following::select[1]"))))

selectFood.select_by_value(1)

selectDrink=Select(WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"//td[text()='Drink']/following::select[1]"))))

selectDrink.select_by_value(1)

You need to import following libraries.

from selenium.webdriver.common.by import By
from selenium.webdriver.support.wait import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.support.select import Select

score 0 · Answer 4 · answered Feb 02 '23 at 13:44

There are total three (3) html-select elements within the HTML provided and to select an option you have to use the Select() class and inducing WebDriverWait for the element_to_be_clickable() you can use either of the following locator strategies:

# using select_by_visible_text() to select spaghetti
Select(WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//select[@id='xx2']")))).select_by_visible_text("spaghetti")

# using select_by_index() to select Tea
Select(WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//select[@id='kj2']")))).select_by_index(2)

# using select_by_value() to select the second option from the third dropdown
Select(WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//select[@id='jj']")))).select_by_value('2')

How to select dropdown in the dynamic table Selenium webdriver

4 Answers4