Focal Point
[SOLVED].JS error in IE, works in Viewer

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/9357027976

December 10, 2015, 11:12 AM
Neal
[SOLVED].JS error in IE, works in Viewer
This is difficult to document well. The pieces have to be considered together to make much sense.

When I click on the calendar icon in Viewer the .js has no problem. In IE or Chrome I get:
'Uncaught TypeError: Cannot read property 'parentNode' in the .js line 692



This div with the calendar icon is created on the fly (via a fex and Ajax) and therefore does not exist at the top of the HTML.

Below is the code building the calendar html to be appended to a div via Ajax.

-SET &SEMI=';';
-SET &='&';
-SET &ANCHOR = IF '&PARMNO.EVAL' EQ 'DATE1' THEN 'ANCHOR1' ELSE 'ANCHOR2';
-SET &CLNM= IF '&PARMNO.EVAL' EQ 'DATE1' THEN ' onClick="javascript:clickdt1();"'
-                                        ELSE ' onClick="javascript:clickdt2();"' ;
-SET &DTNM=IF '&PARMNO.EVAL' EQ 'DATE1' THEN 'date1' ELSE 'date2';
-SET &PATTERN='MM/dd/yyyy';

-SET &QT='''';
-SET &SEMI=';';
-SET &CLICKX = IF '&PARMNO.EVAL' EQ 'DATE1' THEN
- 'onClick="cal1x.select(&PARMNO,&QT&ANCHOR&QT,&QT&PATTERN&QT); return false;" '
-  ELSE
- 'onClick="cal2x.select(&PARMNO,&QT&ANCHOR&QT,&QT&PATTERN&QT); return false;" ';

-* This is the first Date Select
DEFINE FILE xxxxxxxxx
CNTR/I5 WITH REPORTNAME=CNTR+ 1;
HLINE/A1000 WITH REPORTNAME=
'<html><head> '|
' <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> '|
'</head><body>'|
' <TABLE border cellpadding=1  class="selwidth" ><TR align=right><TD>'|
' &PARMLBL.EVAL '|'&'|'nbsp'|
'<input type="text" name="&DTNM" id="&DTNM" '|
' maxlength="10" size="12">'|
'<A HREF="#" style="color:red"; '|
' &CLNM ' |
' NAME="&ANCHOR" ID="&ANCHOR"> '|
'<img src="/approot/baseapp/calendar-icon16.png" style="background-color: #684dff";>'|
'</a>'|
'</TD></TR></TABLE>' |
'</body></html>';
END 
TABLEF FILE xxxxxxxx
PRINT HLINE AS ''
IF READLIMIT IS 1
ON TABLE PCHOLD
END
-RUN 



ajax to append is
      $.ajax({
            type    : "GET",
	    async   :false,
            url     : _url  + _procedure + "&"+"rnd=" + Math.random(),
            data    :{ "PARMRPT": elem, "PARMNO": atype, "PARMLBL": alabel  },
	    dataType: "text",
            success : function(_data1) {
	 $("#parms").append($(_data1).text());
		     }
	  	 })  




.js code fragment is
 		else if (this.use_gebi && e) {
			var t = e.originalTarget;
line 692---->>>>>>>	while (t.parentNode != null) {
				if (t.id==this.divName) {
					return true;
					}
				t = t.parentNode;
				}
			return false;
			} 



In the entire .js these are the only references to t.parentNode. I am tempted to simply remove them and simply always return true.

Below is the setup to invoke the .js functionality in head section of main html.

 <SCRIPT LANGUAGE="JavaScript" SRC="/approot/baseapp/CalendarPopup.js"></SCRIPT>

<link rel="stylesheet" type="text/css" href="/approot/baseapp/calendar.css">
<SCRIPT LANGUAGE="JavaScript" ID="jscal1x">
	var cal1x = new CalendarPopup("testdiv1");
	cal1x.setCssPrefix("TEST");
	cal1x.showNavigationDropdowns();
cal1x.offsetX = -20;
cal1x.offsetY = 25;
</SCRIPT>  


This is the function used when the calendar icon is clicked. Note that 'function.call' is used to make the function act as if it was invoked from inside the div. Required because the .js uses 'this' notation.

 
function clickdt1(){
var  doit1="cal1x.select(date1,'ANCHOR1','MM/dd/yyyy'); return false;"
var tmpFunc1= new Function(doit1);
  myobj1=document.getElementById(ANCHOR1);
 tmpFunc1.call(myobj1,date1,'ANCHOR1','MM/dd/yyyy');
                   } 



Clear as mud? I would like to include the actual calendar 'view source code', but the created div is not in the 'source code'.
ideas?

Neal

This message has been edited. Last edited by: <Emily McAllister>,


WebFOCUS 8
Windows, All Outputs
December 10, 2015, 12:04 PM
Francis Mariani
Clear as bad coffee.

Important to verify:



Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
December 10, 2015, 12:09 PM
Francis Mariani
Neal, since you're doing a lot of stuff manually, I suggest using jQuery and jQuery UI - you then do not have to rely on WF JavaScript, and the jQuery UI Calendar control is way smarter than the WF one.

This message has been edited. Last edited by: Francis Mariani,


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
December 10, 2015, 12:21 PM
Neal
Jquery calendar?

Who knew? I am an 'old timer', new to jquery and ajax. much to learn and be aware of.

I shall investigate and use.

Tx
Neal


WebFOCUS 8
Windows, All Outputs
December 10, 2015, 12:24 PM
GavinL
quote:
Neal, since you're doing a lot of stuff manually, I suggest using jQuery and jQuery UI - you then do not have to rely on WF JavaScript, and the jQury UI Calendar control is way smarter than the WF one.






- FOCUS Man, just FOCUS!
-----------------------------
Product: WebFOCUS
Version: 8.1.04
Server: Windows 2008 Server
December 10, 2015, 12:48 PM
Francis Mariani
It's 2015 and I still haven't figured out how to prevent the user from clicking on Saturday and Sunday dates. Also, I haven't figured out how to allow a click on only certain dates in a range... jQuery Calendar can do that and more.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
December 10, 2015, 12:51 PM
Francis Mariani
quote:
When I click on the calendar icon in Viewer the .js has no problem. In IE or Chrome I get:
'Uncaught TypeError: Cannot read property 'parentNode' in the .js line 692


Neal, what version of IE are you using? I've had issues with WF 8.0.08 and IE 11. If you set compatiblity mode on, or use F12 and set the emulation to IE 9 the problems seem to go away...


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
December 10, 2015, 04:24 PM
Neal
Yikes,

It is IE 11.

Have to try emulation to 9.

Tx
Neal


WebFOCUS 8
Windows, All Outputs
December 10, 2015, 04:30 PM
Neal
nope, 9 not work. Chrome has same problem.

Jquery UI seems best.

Neal


WebFOCUS 8
Windows, All Outputs
December 14, 2015, 04:03 PM
GavinL
<script type="text/javascript">
    jQuery(document).ready(function() {

        // An array of dates
        var eventDates = {};
		var splitdates = '!IBI.AMP.RESULTDT;'.split(",");

		for (i = 0; i < splitdates.length; i++)  {
    		eventDates[ new Date( splitdates[i] )] = new Date( splitdates[i] );
		}

        // datepicker
        jQuery('#datepicker').datepicker({
            beforeShowDay: function( date ) {
                var highlight = eventDates[date];
                if( highlight ) {
                     return [true, "event", "highlight"];
                } else {
                     return [true, '', ''];
                }
             }
        });

    });




- FOCUS Man, just FOCUS!
-----------------------------
Product: WebFOCUS
Version: 8.1.04
Server: Windows 2008 Server
December 15, 2015, 10:14 AM
Neal
I have it all working fine with Jquery ui. Thanks for all the input.

Neal


WebFOCUS 8
Windows, All Outputs
December 15, 2015, 02:01 PM
Francis Mariani
quote:
I have it all working fine with Jquery ui



Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server