Select Selenium date web driver from jquery datepicker-Ui

Question

As a selena web driver, it can select a jqery datepicker-UI date for a specific date field. 1) I tried using Jscript to set the date. But, nevertheless, the msut date should be selected from the jquery popup to get the submitted form.

Please suggest a way to automatically select a date and send the selected value to the date field.

thanks

Answer 1

driver.findElement(By.id("datepicker")).clear(); driver.findElement(By.id("datepicker")).sendKeys(""); // This will add focus and open the Date picker String Year = driver.findElement(By.cssSelector("span.ui-datepicker-year")).getText(); //This will give you Year String month = driver.findElement(By.cssSelector("span.ui-datepicker-month")).getText(); //This will give you Month driver.findElement(By.cssSelector("span.ui-icon.ui-icon-circle-triangle-e")).click(); // Click for Next Month String SelectedDate = driver.findElement(By.cssSelector(".ui-state-highlight")).getText(); // This will get you the selected Date driver.findElement(By.cssSelector("span.ui-icon.ui-icon-circle-triangle-w")).click(); // Click for Previos Month driver.findElement(By.linkText("6")).click(); // Instead of 6 use value date which you want to select. 

Hope this helps you.

thanks
Hung

Answer 2

The date field is a normal text input field. Therefore, you can send sendKeys in the date input field in the correct format as follows:

 // Find the text input element by its name WebElement element = driver.findElement(new ByIdOrName("datefield"))); // Enter a date in your format element.sendKeys("01/01/2009"); 

Answer 3

I found some links with less optimal implementations. Using the Selenium Select class is not too complicated. Here is my useful utility with

 public static void selectDateFromJqueryDatepicker(WebElement datePickerDiv, int expYear, int expMonth, int expDay) { //handle 2 digit years if(expYear < 100) expYear += 2000; //select the given year Select yearSel= new Select(datePickerDiv.findElement(By.className("ui-datepicker-year"))); yearSel.selectByValue(String.valueOf(expYear)); //select the given month Select monthSel= new Select(datePickerDiv.findElement(By.className("ui-datepicker-month"))); monthSel.selectByValue(String.valueOf(expMonth - 1)); //value start @ 0 so we need the -1 //get the table WebElement calTable= datePickerDiv.findElement(By.className("ui-datepicker-calendar")); //click on the correct/given cell/date calTable.findElement(By.linkText(String.valueOf(expDay))).click(); } 

You just need to pass the year / month / day in integer format and an external datepicker div. In my case, I found it as follows

 WebElement datePickerDiv= findElement(By.id("ui-datepicker-div")); 

Answer 4

I have a webpage and it has 2 ui-date collectors to select a date. I use javascript and it works My page

Number 1: id: POcheck_D ...... Number 2: id: fromDate ........ Number 3: id: toDate

 public void TestCase1() { //open brower driver = new InternetExplorerDriver(); driver.Url = "xxxYourPagexxxx.com"; driver.Navigate(); //click check box driver.FindElement(By.Id("POcheck_D")).Click(); //insert value to ui-datepicker ((IJavaScriptExecutor)driver).ExecuteScript("$('#fromDate').val('01/01/2016').change();"); ((IJavaScriptExecutor)driver).ExecuteScript("$('#toDate').val('31/12/2017').change();"); //click button search driver.FindElement(By.Id("btn_search")).Click(); }