Search code examples
pythonseleniumdatepickersetattributereadonly-attribute

Select Date from dropdown datepicker using Selenium and Python


I tried to select different date rather than default (current date). e.g the initial page pop up with shareholding date : 2023/02/01, but I want to select different date say, 2022/12/23 from the dropdown menu.

My environment is : Selenium 4.3.0 and Python 3.9.7, Chrome

Following is my code:

url = "https://www3.hkexnews.hk/sdw/search/mutualmarket.aspx?t=hk&t=hk&t=hk&t=hk"
driver = webdriver.Chrome()
driver.get(url)
select_element = driver.find_element(By.XPATH, "//input[@name='txtShareholdingDate']").click()
# The above pop up the required page with Date dropdown, tried different code to select the date but failed. My codes are:

action = ActionChains(select_element)
action.send_keys("2023",Keys.ARROW_DOWN)
action.send_keys("1",Keys.ARROW_DOWN)
action.send_keys("31",Keys.ARROW_DOWN)
action.send_keys(Keys.ENTER)
action.perform()
# AttributeError: 'NoneType' object has no attribute 'execute'

# Also tried
select = driver.find_element(By.ID, "txtShareholdingDate")
select.select_by_value("2023/01/31")
driver.find_element(By.ID, 'btnSearch').click()

Error:

AttributeError: 'WebElement' object has no attribute 'select_by_value'

Any suggestions?


Solution

  • The <input> element to select a date within the website is having the attribute readonly="readonly" set:

    <input name="txtShareholdingDate" type="text" value="2023/02/01" id="txtShareholdingDate" class="input-searchDate active" data-reset="2023/02/01" readonly="readonly">
    

    Solution

    To select a date you need to remove the readonly attribute and set the value attribute to the new date as follows:

    driver.get("https://www3.hkexnews.hk/sdw/search/mutualmarket.aspx?t=hk&t=hk&t=hk&t=hk")
    element = driver.find_element(By.CSS_SELECTOR, "input#txtShareholdingDate")
    driver.execute_script("arguments[0].removeAttribute('readonly')", element)
    driver.execute_script("arguments[0].setAttribute('value', '2023/01/31')", element)
    driver.find_element(By.CSS_SELECTOR, "input#btnSearch").click()
    

    Browser snapshot:

    date_select