Selenium Webdriver: stale element reference - xpath

Question

Am getting the below error:
stale element reference: element is not attached to the page document.
When I select a country from the country dropdown the page gets refreshed since we have used 'onchange' attribute, so when i try to locate rest of the fields in the form its throwing me the stated exception.
Note: I have cross verified the locators before and after the page gets loaded,
there is no change in it as most of the locators used are id's.
Here is my HTML,
<form method="post" action="/eClaims/app" name="mainForm" id="mainForm"
accept-charset="utf-8">
<div style="display: none;">
<input type="hidden" name="formids"
value="ifErrors,hasErrors,If,If_0,statusDate1,If_1,If_3,If_5,If_7,If_2,callDate,If_8,If_4,countryList,If_9,If_6,languageList,If_10,If_11,If_12,customerEmail,If_13,If_14,customerTitle,If_15,customerFirstName,If_16,If_17,customerLastName,If_18,customerCompany,If_19,If_20,If_21,customerFaxPhoneCode,customerFaxNumber,If_22,If_23,customerPhoneCode,customerPhoneNumber,If_24,If_25,qualificationSystem,If_26,If_27,caseId,If_28,If_29,productNumber,If_30,If_31,serialNumber,If_32,If_33,If_34,purchaseDate,If_35,If_36,problemDescription,If_37,qualificationAgent,If_38,If_39,If_40,cancelDoaAuth,If_41,Submit_0,If_42,Submit_1,If_43,Submit_2,If_44,If_45,If_46,If_47,Submit_6,Submit_7,Submit_8">
<input type="hidden" name="component" value="mainForm"> <input
type="hidden" name="page" value="DoaAuthorisationForm">
</div>
<table width="100%">
<tbody>
<tr>
<td colspan="3"></td>
</tr>
<tr class="theme">
<th width="100%" colspan="3">
<h2 class="themeheader">Authorisation to return DOA product</h2>
</th>
</tr>
<tr>
</tr>
<tr>
<td colspan="10"><font color="red">please obtain a valid
proof of purchase from the customer before proceeding with this
form. </font></td>
</tr>
<tr>
<td colspan="3"><hr width="100%"></td>
</tr>
<!-- <tr style="visibility: hidden;">
<td>
<span key="label.status" ></span>
</td>
<td class="inputFormCell">
<span jwcid="statusList" ></span>
</td>
</tr> -->
<tr style="visibility: hidden;">
<td>Status Date</td>
<td class="inputFormCell"><input type="text" name="statusDate1"
value="" title="dd MMM yyyy" id="statusDate1"> <a
href="javascript:calendar_statusDate1.toggle(document.mainForm.statusDate1);"><img
src="/eClaims/app?digest=d1154f8b7bf653ba6128f8cb1f5c8e95&path=%2Forg%2Fapache%2Ftapestry%2Fform%2FDatePickerIcon.png&service=asset"
border="0"></a></td>
</tr>
<tr>
<td>Call Date<font color="red"> *</font>
</td>
<td class="inputFormCell"><input type="text" name="callDate"
value="" title="dd MMM yyyy" id="callDate"> <a
href="javascript:calendar_callDate.toggle(document.mainForm.callDate);"><img
src="/eClaims/app?digest=d1154f8b7bf653ba6128f8cb1f5c8e95&path=%2Forg%2Fapache%2Ftapestry%2Fform%2FDatePickerIcon.png&service=asset"
border="0"></a></td>
</tr>
<tr>
<td>Country<font color="red"> *</font>
</td>
<td class="inputFormCell"><select name="countryList"
id="countryList" style="width: 180px;"
onchange="javascript:onChangeCountry(this);">
<option value="">--please select--</option>
<option value="AF">Afghanistan</option>
<option value="AS">American Samoa</option>
<option value="AU" selected="selected">Australia</option>
<option value="BD">Bangladesh</option>
<option value="WF">Wallis And Futuna</option>
<option value="WS">Samoa</option>
</select></td>
</tr>
<tr>
<td>Language<font color="red"> *</font>
</td>
<td class="inputFormCell"><select name="languageList"
id="languageList" style="width: 180px;">
<option value="" selected="selected">--please select--</option>
<option value="EN">English</option>
</select></td>
</tr>
<tr>
<td>Customer Email<font color="red"> *</font><font color="red">
*</font>
</td>
<td class="inputFormCell"><input type="text"
name="customerEmail" value="" id="customerEmail"></td>
</tr>
<tr>
<td colspan="3">**Fax Number mandatory for 'Save & Fax',
e-Mail mandatory for 'Save & Mail'</td>
</tr>
<tr>
<td class="section_content"><input type="submit"
name="Submit_6" value="[BUTTON.SUBMIT1]" id="submitDummy"
class="primButton" style="visibility: hidden;"></td>
<td class="section_content"><input type="submit"
name="Submit_7" value="[BUTTON.SUBMIT2]" id="submitAuth"
class="primButton" style="visibility: hidden;"></td>
</tr>
<tr>
<td class="section_content"><input type="submit"
name="Submit_8" value="[BUTTON.SUBMIT2]" id="submitMailAuth"
class="primButton" style="visibility: hidden;"></td>
</tr>
</tbody>
</table>
</form>
I have tried the following solutions,
new WebDriverWait(driver, 500)
.ignoring(StaleElementReferenceException.class)
.until(new Predicate<WebDriver>() {
public boolean apply(#Nullable WebDriver driver) {
Select selectLanguage;
try {
selectLanguage = new Select(getWebElement("apj.newdoa.language"));
selectLanguage.selectByValue("EN");
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return true;
}
});
2nd Solution,
Wait<WebDriver> wait = new FluentWait<WebDriver>(driver)
.withTimeout( 120, TimeUnit.SECONDS )
.pollingEvery( 20, TimeUnit.SECONDS )
.ignoring( NoSuchElementException.class, StaleElementReferenceException.class );
// using a customized expected condition
Select foo1 = wait.until(new Function<WebDriver, Select>() {
Select selectLanguage;
public Select apply(WebDriver driver) {
try {
selectLanguage = new Select(getWebElement("apj.newdoa.language"));
logger.info("Value of Option:\t" +selectLanguage.toString());
return selectLanguage = new Select(getWebElement("apj.newdoa.language"));
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return selectLanguage;
}
});
foo1.selectByValue("EN");
Thanks in advance