Did any one find solution to select date from date picker?

[Abhay_Kulkarni]

Hello Friends,

Did any one worked on date picker using script?

I manage to select it by creating dynamic xpath, but it is very slow. I am using VBScript for it.

If anybody worked on it please help?

Thanks,

Abhay Kulkarni

[AlexKaras]

Hi Abhay,

Why and what for do you need to automate date picker? Are you testing it?

Quite often, direct assignment of the date/time to the field works.

For example:

oControl.Value = strValue ' initial assignment of the date to the control
oControl.Click ' opens drop-down calendar and selects date from oControl.Value

Set page = GetPage()
Call page.WaitAliasChild("panelUiDatepickerDiv", 10000) ' waits for the calendar to open
Call aqUtils.Delay(500) ' safety delay
Call page.panelUiDatepickerDiv.Keys("[Enter]") ' confirms date and allows jscript code to do its job

[Abhay_Kulkarni]

Hi Alex,

Thanks for your reply. But in this case we can't enter date into it. We need to select it. Let me explain it in details,

There is date picker on screen, First text box is editable and second is not editable. If we click on first text box then calendar gets open with two months. We need to click on first date and click on second date (It will select range of dates), when we click on second date it will display first date in first text box and second date in second text box. (Please find attached clip of date picker.). I tried it using recording, but it is not selected.

Thanks,

Abhay

[AlexKaras]

Hi Abhay,

Visually, your calendar controls look like those I worked with, so I hope that my suggestion may work for you. Try to assign the date (as per my example) to the first control, click on it to open the calendar, press Enter to confirm the date and assign then the needed value to the second control. Maybe, this will work.

As a side note and according to my understanding of the screenshot you have provided: I see some potential usability problem here - the first control is constantly used to enter values to it and another control (Checkout one). If I, as a user, would like to correct the checkout date, I must understand that I need to enter the first control, leave its date as it is and correct only the second date. Seems to be not very intuitive and error prone, as the initial date may be changed occasionally and this change may left not noticed. Isn't it better to discuss the possibility to make both controls to be editable? In addition to improved usability, this may make your life easier as well because it will be possible to set data to both controls independently.

[baxatob]

Hi Abhay,

Another possible solution is to find a JavaScript function to setup a date directly.

[AlexKaras]

@baxatob:

Really sorry for jumping-in, but can't withstand to extend your reply a bit (in square brackets):

Another possible solution is to find [on the page] a JavaScript function to setup a date [and call this function] directly [as described here: http://support.smartbear.com/testcomplete/docs/app-testing/web/general/common-tasks/javascript.html].

[Abhay_Kulkarni]

Sorry for late response.

But it did not work. But If  I write below command in developer tool's console window then it works on browser.

 document.getElementById('txtDepartureDate').value = "08/03/2017" 

Is it possible to write above Javascript statement into my VBScript Project of TestComplete?

On link  https://support.smartbear.com/testcomplete/docs/app-testing/web/general/common-tasks/javascript.html... there is solution to run javascript function exist in Application Under Test. How can I execute javascript statement?

Thanks,

Abhay Kulkarni

[baxatob]

Hi,

Try to set the value directly. E.g.:

Aliases.browser.yourTargetElement.value = "08/03/2017"

where yourTargetElement is the mapped name 
of the element with id "txtDepartureDate"

[amitkumarlogs]

@baxatob Thank you so much, its working fine for me. It will be really helpful if you could help me out to do it by clicking on particulate date from calender picker.

[baxatob]

Hi,

The implementation of clicking on particular date depends on how the date is represented in you datepicker - separate days, months and years, or may be some elements are grouped by some logic. It is difficult to say how to do it without seeing the web element and its properties.

Usually direct setting of the date (using JS or element's value attribute) - the most easy, fast and reliable way.