I'm facing a strange issue with the SELECT object in a Modal Window.
Within my HTML code, I have a button that opens a modal window when clicked. Inside this modal window, a JSP page is loaded. On this JSP page, there is a dropdown list created using the tag, along with a button that triggers a JavaScript function to display the selected items and ultimately send them back to the parent window. The problem arises when attempting to retrieve the length or selectedIndex values as it fails without any alert being displayed. Unfortunately, due to security restrictions within my Company, I am unable to access the error messages or view the source code.
Here's the snippet of code:
The JavaScript responsible for opening the modal window:
var oReturnValue = window.showModalDialog('addnewfilters', '', "dialogHeight:505px;dialogWidth:300px;resizable:yes;center:1;");
The HTML and JavaScript within the Modal Window:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"/>
<title> Add New Field as a Filter</title>
<script type="text/javascript" src="js/filters.js">
var oReturnObject = new Object();
window.onbeforeunload = function()
{
window.returnValue = oReturnObject;
}
</script>
<script type="text/javascript">
/*
* Adds a one or more Filters
*/
function addNewField(selectObj){
var sFields = "";
var fieldsArray = new Array();
alert("List name : " + selectObj.name);
alter("List length : " + selectObj.length);
for(i=0; i < selectObj.length; i ++){
alert("Element : " + selectObj[i]);
if (selectObj[i].selected){
sFields = selectObj[i] + ",";
fieldsArray.push(selectObj[i]);
}
}
oReturnObject.selFields = sFields;
window.close();
}
</script>
</head>
<body>
<select id="filtersList" name="filtersList" multiple="multiple">
<option value="dtcreated">DTCREATED</option>
<option value="dtupdated">DTUPDATED</option>
<option value="vchstatus>VCHSTATUS</option>
<option value="intjrnlcnt">INTLJRNCTL</option>
</select>
<button id="btnAddFilter" onClick="addNewField(document.getElementById('filtersList'))">Add Fields to Filter</button>
<button id="btnCancel" onclick="window.close();">Cancel</button>
</body>
</html>
Upon clicking the "Add Fields to Filter" button, I receive an alert displaying the SELECT tag's name but no subsequent alerts appear.
Could this be related to IE8 and modal windows? My testing in a regular window yielded successful results.