open window problem

geogomez · December 6th, 2005, 09:39 PM

Hi all:

I'm having a strange problem. Perhaps someone has seen it and can help.

I have a window with an add button. On clicking this button, it calls the function "AddDetDev". This function opens a new window, populates a list box, sets a hidden field, and calls an init function in the new window. All this works fine most of the time, but sometimes it throws an error: "Error: 'document.frmDetDev.lstDetDevNames' is null or not an object". This error can be recreated by clicking the Add button and closing the new window when it comes up continuously until the error is thrown.
The problem appears to be timing related. I think when the variable, oDetDevWin, is referenced, the new window has not finished being instanciated, thus the error. Is there a way to check that a window has been fully instanciated before referencing any of its objects?
Or perhaps its something else.
In any case, your help is fully appreciated.

Here is the code:

****** main window (configuration.htm file)******

<html>

<head>
<script language="JavaScript">
function UpdateControls()
{
    document.frmConfig.lstHdnDetDev.style.display="non e";
}
function AddDetDev()
{
    //create window
    var oDetDevWin=window.open("DetectionDevice.htm", null,"toolbar=no, titlebar=no, menubar=no, left=200, top=200, scrollbars=no, resizeable=no, width=410, height=150");
    //populate list box with det devs
    for (var i=0;i<document.frmConfig.lstHdnDetDev.length;i++)
    {
        var oDetDevNamesLst=oDetDevWin.document.frmDetDev.lstD etDevNames;
        var oDetDevNamesOpt=oDetDevWin.document.createElement( "OPTION");
        oDetDevNamesOpt.text=document.frmConfig.lstHdnDetD ev(i).text;
        oDetDevNamesOpt.value=document.frmConfig.lstHdnDet Dev(i).value;
        oDetDevNamesLst.add(oDetDevNamesOpt);
    }
    //set action to Add
    oDetDevWin.document.frmDetDev.hdnAction.value="1";
    //init new window controls
    oDetDevWin.UpdateControls();
}
function EditDetDev(vRowNum, vDetDevName)
{
    //create window
    var oDetDevWin=window.open("DetectionDevice.htm", null,"toolbar=no, titlebar=no, menubar=no, left=200, top=200, scrollbars=no, resizeable=no, width=410, height=150");
    //populate list box with det devs
    for (var i=0;i<document.frmConfig.lstHdnDetDev.length;i++)
    {
        var oDetDevNamesLst=oDetDevWin.document.frmDetDev.lstD etDevNames;
        var oDetDevNamesOpt=oDetDevWin.document.createElement( "OPTION");
        oDetDevNamesOpt.text=document.frmConfig.lstHdnDetD ev(i).text;
        oDetDevNamesOpt.value=document.frmConfig.lstHdnDet Dev(i).value;
        oDetDevNamesLst.add(oDetDevNamesOpt);
        //select matching name
        oDetDevNamesOpt.selected=(oDetDevNamesOpt.text==vD etDevName) ? true : false;
    }
    //set action to Edit
    oDetDevWin.document.frmDetDev.hdnAction.value="0";
    //remember table row
    oDetDevWin.document.frmDetDev.hdnTblRow.value=vRow Num;
    //init new window controls
    oDetDevWin.UpdateControls();
}
function UpdateDetDev(vDetDevAction, vTblRowNum, vDetDevName, vLstIndex)
{
    switch (vDetDevAction)
    {
        case "0": //editing
            //get cell to update
            var sCellID="DDTblR" + vTblRowNum + "C2";
            var oCell=document.getElementById(sCellID);
            //update name/link
            oCell.innerHTML="<a href=javascript:EditDetDev(" + vTblRowNum + ",\"" + vDetDevName + "\")>" + vDetDevName + "</a>";
            //update hidden list
            for (i=0;i<document.frmConfig.lstHdnDetDev.length;i++)
            {
                //name already in list, get out
                if (document.frmConfig.lstHdnDetDev(i).text==vDetDevN ame)
                {
                    break;
                }
            }
            //name changed, update it
            if (i==document.frmConfig.lstHdnDetDev.length)
            {
                document.frmConfig.lstHdnDetDev(vLstIndex).text=vD etDevName;
                document.frmConfig.lstHdnDetDev(vLstIndex).value=v DetDevName;
            }
            break;
        case "1": //adding
            //add new row
            var oTR=window.document.all.tblDetDev.insertRow();
            vTblRowNum=window.document.all.tblDetDev.rows.leng th-1;
            oTR.id="DDTblR" + vTblRowNum;
            //add 1st col
            var oTD=oTR.insertCell();
            oTD.id="DDTblR" + vTblRowNum + "C1";
            oTD.bgColor=0xffffff;
            oTD.innerText=vTblRowNum;
            //add 2nd col
            var oTD=oTR.insertCell();
            oTD.id="DDTblR" + vTblRowNum + "C2";
            oTD.bgColor=0xffffff;
            oTD.innerHTML="<a href=javascript:EditDetDev(" + vTblRowNum + ",\"" + vDetDevName + "\")>" + vDetDevName + "</a>";
            //update hidden list
            for (i=0;i<document.frmConfig.lstHdnDetDev.length;i++)
            {
                //name already in list, get out
                if (document.frmConfig.lstHdnDetDev(i).text==vDetDevN ame)
                {
                    break;
                }
            }
            //new name, add it
            if (i==document.frmConfig.lstHdnDetDev.length)
            {
                var oDetDevOpt=document.createElement("OPTION");
                oDetDevOpt.text=vDetDevName;
                oDetDevOpt.value=vDetDevName;
                document.frmConfig.lstHdnDetDev.add(oDetDevOpt);
            }
            break;
        case "2": //deleting
            window.document.all.tblDetDev.deleteRow(vTblRowNum );
            //renumber table and link parameter
            for (i=1;i<window.document.all.tblDetDev.rows.length;i ++)
            {
                var oTR=window.document.all.tblDetDev.rows(i)
                oTR.id="DDTblR" + i;
                var oTD=oTR.cells(0);
                oTD.id="DDTblR" + i + "C1";
                oTD.innerText=i;
                var oTD=oTR.cells(1);
                oTD.id="DDTblR" + i + "C2";
                oTD.innerHTML="<a href=javascript:EditDetDev(" + i + ",\"" + oTD.innerText + "\")>" + oTD.innerText + "</a>";
            }
            break;
    }
}
</script>
</head>

<body bgcolor="#c0c0c0" onload="UpdateControls()">
<form method="post" name="frmConfig">
<select size="1" name="lstHdnDetDev">
<option value="3000GCP">3000GCP</option>
<option value="600GCP">600GCP</option></select>
<fieldset style="PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px">
    <legend><b>Detection Devices</b></legend>
    <table border="0" width="500" id="table7">
        <tr>
            <td width="17"></td>
            <td width="381">
            <table border="1" width="189" bordercolor="#000000" id="tblDetDev" cellspacing="0" style="BORDER-COLLAPSE: collapse">
                <tr>
                    <td width="50">Track #</td>
                    <td width="107">Name</td>
                </tr>
                <WC@DET_DEVS></WC@DET_DEVS>
            </table>
            </td>
            <td width="88">
            <input type="button" value="Add" name="btnAddDetDev" style="COLOR: rgb(0,0,255)" tabindex="18" onclick="AddDetDev()"></td>
        </tr>
        </table>
    </fieldset>
</form>
</body>

</html>

******new window (DetectionDevice.htm file)******

<html>

<head>
<script language=JavaScript>

function UpdateControls()
{
    //adding, hide delete button
    if (document.frmDetDev.hdnAction.value=="1")
    {
        document.title="Add Detection Device"
        document.frmDetDev.btnDelete.style.display="none"
    }
    //editing, show selected name
    else
    {
        document.title="Edit Detection Device"
        document.frmDetDev.lstDetDevNames.fireEvent('oncha nge');
    }
}

function Save()
{
    //trying to save blank name, get out
    if (document.frmDetDev.txtDetDevName.value=="") return;
    //pass action, table row number and name
    window.opener.UpdateDetDev(document.frmDetDev.hdnA ction.value,
                                document.frmDetDev.hdnTblRow.value,
                                document.frmDetDev.txtDetDevName.value,
                                document.frmDetDev.lstDetDevNames.selectedIndex-1);
    self.close();
}

function Delete()
{
    //trying to delete blank name, get out
    if (document.frmDetDev.txtDetDevName.value=="") return;
    //pass action, table row number and name
    window.opener.UpdateDetDev("2",document.frmDetDev. hdnTblRow.value,document.frmDetDev.txtDetDevName.v alue);
    self.close();
}

</script>
</head>

<body>
<form name=frmDetDev method=post>
<input type="hidden" name="hdnAction" value="0">
<input type="hidden" name="hdnTblRow" value="0">
<table border="0" width="391" id="table1">
    <tr>
        <td width="27"> </td>
        <td width="354">Device Name:</td>
    </tr>
    <tr>
        <td width="27"> </td>
        <td width="354">
        <input type="text" name="txtDetDevName" size="20" tabindex="1"></td>
    </tr>
    <tr>
        <td width="27"> </td>
        <td width="354">
            <select size="1" name="lstDetDevNames" tabindex="2"
                onchange="document.frmDetDev.txtDetDevName.value=d ocument.frmDetDev.lstDetDevNames.options[document.frmDetDev.lstDetDevNames.selectedIndex].text">
                <option value="" selected></option>
            </select>
        </td>
    </tr>
    <tr>
        <td width="72%" colspan="2"> </td>
    </tr>
    <tr>
        <td width="72%" colspan="2">
            <p align="right">
            <input type="button" value="Save" name="btnSave" tabindex="3" onclick="Save()">
            <input type="button" value="Delete" name="btnDelete" tabindex="4" onclick="Delete()">
            <input type="button" value="Cancel" name="btnCancel" tabindex="5" onclick="javascript:window.close();">
        </td>
    </tr>
</table>
</form>
</body>

</html>

geogomez · December 6th, 2005, 10:29 PM

I found an easier way to duplicate the problem. Just click on the Add button twice and the error is thrown.

joefawcett · December 9th, 2005, 05:23 AM

Without delving too deeply I suspect that the page child window has not loaded fully before you try to access the listbox. Try checking that the document's ready state is complete before proceeeding:

Code:

oDetDevWin=window.open("DetectionDevice.....
//no var in line above
setTimeout(checkWindow, 500);
function checkWindow()
{
  if (oDetDevWin.document && oDetDevWin.document.readyState == "complete")
{
  //Do listbox code here
}
else
{
  setTimeout(checkWindow, 500);
}
}

--

Joe (Microsoft MVP - XML)