How to select dropkick dropdown using selenium webdriver

Question

Hi my drop down HTML like this

<div id="dk_container_ddlGuestGender" class="dk_container dk_theme_default" tabindex="0">
  <a class="dk_toggle" style="width: 100px;">
    <span class="dk_label">Female</span>
  </a>
  <div class="dk_options" style="top: 21px;">
    <ul class="dk_options_inner">
      <li class="" style="">
        <a data-dk-dropdown-text="Male" data-dk-dropdown-value="1">Male</a>
      </li>
      <li class="dk_option_current">
        <a data-dk-dropdown-text="Female" data-dk-dropdown-value="2">Female</a>
      </li>
    </ul>
  </div>
  <select id="ddlGuestGender" name="ddlGuestGender" style="display: none;">
    <option value="1">Male</option>
    <option value="2">Female</option>
  </select>
</div>

how to identify the dropkick drop down element and select the value which is available in drop down list.My code as follows

WebElement genderdropdown= driver.findElement(By.xpath("//select[@id='ddlGuestGender']"));

     Select selgender=new Select(genderdropdown);

     selgender.selectByValue("2");

Answer 1

Simplest would be something like this:

(JavascriptExecutor)driver.executeScript("document.getElementById('ddlGuestGender').selectedIndex = 1;");

Or possibly:

(JavascriptExecutor)driver.executeScript("document.getElementById('ddlGuestGender').value = 2;");

Answer 2

For dropkick dropdown you should use below code this will work

 JavascriptExecutor excutor=(JavascriptExecutor) driver;
  excutor.executeScript("$('#ddlGuestGender').dropkick('select', '2')");

Answer 3

In order to automate a dropkick dropdown without executing Javascript I've used:

dropdown = driver.find_element(:id, "dk_container_ddlGuestGender").find_element(:class, "dk_toggle")
dropdown.click

1.times { dropdown.send_keys(:arrow_down) } # for male
2.times { dropdown.send_keys(:arrow_down) } # for female
dropdown.send_keys(:enter)

These are the Ruby bindings but you should be able to change to Java easily.

For a list with more values, I created a hash of index -> name_of_value, and use that to determine the number of down arrows to send to the dropdown.