Using Selenium on calendar date picker

Question

I am trying to pick a date (01/01/2011) from a calendar on this page. https://cotthosting.com/NYRocklandExternal/LandRecords/protected/SrchQuickName.aspx

The calendar is on the part of the form that says Date: FROM. When I click it, a calendar pops up for you to pick dates. However, the field also allows you type in a date. Given the complexity of calendars, I have chosen to use send_keys() but it is not working.

I have identified the empty field date field by its ID but for some reason it does not fill the form. when I try:

driver.find_element_by_id('ctl00_cphMain_SrchDates1_txtFiledFrom').send_keys("01012011")

Any ideas on how I can maneuver it differently? I'm using Python 2.7 with Selenium and ChromeDriver

Solution 1

To get this to work, add one extra step of clicking the element before sending the keys:

datefield = driver.find_element_by_id('ctl00_cphMain_SrchDates1_txtFiledFrom')
datefield.click()
datefield.send_keys("01012011")

Update:

It looks like you might have to use ActionChains after all in your case, which will allow you to chain a series of actions together, and then perform them one after the other:

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains

driver = webdriver.Chrome()

driver.get("https://cotthosting.com/NYRocklandExternal/User/Login.aspx")
driver.find_element_by_id('ctl00_cphMain_blkLogin_btnGuestLogin').click()

driver.find_element_by_id('ctl00_cphMain_SrchNames1_txtFirmSurName').send_keys("Adam")

datefield = driver.find_element_by_id('ctl00_cphMain_SrchDates1_txtFiledFrom')

ActionChains(driver).move_to_element(datefield).click().send_keys('01012011').perform()
search_btn = driver.find_element_by_id('ctl00_cphMain_btnSearchAll')
ActionChains(driver).move_to_element(search_btn).click().click().perform()

I am not sure why two click() calls were necessary in this case, but it seems that they were. I tried a few other things including double_click(), but this was the only thing that worked for me to get the datefield unfocused and then click the search button.

Solution 2

An alternative solution with some explanation:

Solution

Similar to what is suggested here, do:

from selenium import webdriver
from selenium.webdriver.common.keys import Keys

driver.get("https://cotthosting.com/NYRocklandExternal/LandRecords/protected/SrchQuickName.aspx")

# [Do whatever else is necessary...]

date_input = driver.find_element_by_id('ctl00_cphMain_SrchDates1_txtFiledFrom')
date_input.click()                      # Focus input field
date_input.send_keys(Keys.CONTROL, "a") # Select all pre-existing text/input value
date_input.send_keys(Keys.BACKSPACE)    # Remove that text
date_input.send_keys("01012011")        # Add desired text/set input value

What is going on

Here is a screenshot of devtools open to your page:

Two things stick out:

1. The input has value="From". So if you just call send_keys right away the input will have value From01012011.
2. Parenthetically, it appears that they set input to have type=text (it should really be type=date!)

So we have just ctrl-a, backspace to clear the value.

Comments

[Tendekai Muchenje]

this works for the date sending part, but it now breaks the search button click which was the next event in my script and it was working before this. Any ideas?

[elethan]

@TendekaiMuchenje try the code in my updated answer.

[Jihjohn]

I was using date_input.clear(). But this solved my problem. Thank you so much

[4b0]

Code-only answers are not particularly helpful. Please add some descriptions of how this code solves the problem.

[Admin]

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.