Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #39539 > unrolled thread

Parent crossreference to child/iframe javascript.

Started byJonas Thörnvall <jonas.thornvall@gmail.com>
First post2021-03-02 04:12 -0800
Last post2021-03-04 21:16 +0700
Articles 14 — 2 participants

Back to article view | Back to comp.lang.javascript

Contents

  Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-02 04:12 -0800
    Re: Parent crossreference to child/iframe javascript. JJ <jj4public@gmail.com> - 2021-03-02 23:57 +0700
      Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-02 09:04 -0800
        Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 02:11 -0800
          Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 02:26 -0800
            Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 02:44 -0800
              Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 02:46 -0800
                Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 02:58 -0800
                  Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 03:12 -0800
                    Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 03:14 -0800
              Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 03:26 -0800
                Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 06:15 -0800
      Re: Parent crossreference to child/iframe javascript. Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-03-03 03:17 -0800
        Re: Parent crossreference to child/iframe javascript. JJ <jj4public@gmail.com> - 2021-03-04 21:16 +0700

#39539 — Parent crossreference to child/iframe javascript.

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-02 04:12 -0800
SubjectParent crossreference to child/iframe javascript.
Message-ID<de2af8ec-c7c7-48f5-b2fb-70e1fd75cafdn@googlegroups.com>
I have no problem reach parent scripts from iframe.

And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe.

"The PAD0-PAD15" is in the iframe.

<iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe>

iframe = document.getElementById("VirtualDrum");

function writeOptionList(){
console.log("writeOptionList()");
	iframe.getElementById("PAD0").innerHTML=bigString[0];
	iframe.getElementById("PAD1").innerHTML=bigString[1];
	iframe.getElementById("PAD2").innerHTML=bigString[2];
	iframe.getElementById("PAD3").innerHTML=bigString[3];
	iframe.getElementById("PAD4").innerHTML=bigString[4];
	iframe.getElementById("PAD5").innerHTML=bigString[5];
	iframe.getElementById("PAD6").innerHTML=bigString[6];
	iframe.getElementById("PAD7").innerHTML=bigString[7];
	iframe.getElementById("PAD8").innerHTML=bigString[8];
	iframe.getElementById("PAD9").innerHTML=bigString[9];
	iframe.getElementById("PAD10").innerHTML=bigString[10];
	iframe.getElementById("PAD11").innerHTML=bigString[11];
	iframe.getElementById("PAD12").innerHTML=bigString[12];
	iframe.getElementById("PAD13").innerHTML=bigString[13];
	iframe.getElementById("PAD14").innerHTML=bigString[14];
	iframe.getElementById("PAD15").innerHTML=bigString[15];
}

[toc] | [next] | [standalone]

#39542

FromJJ <jj4public@gmail.com>
Date2021-03-02 23:57 +0700
Message-ID<z63ay9v4303n.l6ah05d6ie1n$.dlg@40tude.net>
In reply to#39539
On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote:
> I have no problem reach parent scripts from iframe.

I doubt it. At least with the given code.

> And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe.
> 
> "The PAD0-PAD15" is in the iframe.
> 
> <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe>
> 
> iframe = document.getElementById("VirtualDrum");
> 
> function writeOptionList(){
> console.log("writeOptionList()");
> 	iframe.getElementById("PAD0").innerHTML=bigString[0];
> 	iframe.getElementById("PAD1").innerHTML=bigString[1];
> 	iframe.getElementById("PAD2").innerHTML=bigString[2];
> 	iframe.getElementById("PAD3").innerHTML=bigString[3];
> 	iframe.getElementById("PAD4").innerHTML=bigString[4];
> 	iframe.getElementById("PAD5").innerHTML=bigString[5];
> 	iframe.getElementById("PAD6").innerHTML=bigString[6];
> 	iframe.getElementById("PAD7").innerHTML=bigString[7];
> 	iframe.getElementById("PAD8").innerHTML=bigString[8];
> 	iframe.getElementById("PAD9").innerHTML=bigString[9];
> 	iframe.getElementById("PAD10").innerHTML=bigString[10];
> 	iframe.getElementById("PAD11").innerHTML=bigString[11];
> 	iframe.getElementById("PAD12").innerHTML=bigString[12];
> 	iframe.getElementById("PAD13").innerHTML=bigString[13];
> 	iframe.getElementById("PAD14").innerHTML=bigString[14];
> 	iframe.getElementById("PAD15").innerHTML=bigString[15];
> }

getElementById() is a method of the document object.
Your `iframe` is an element object.

[toc] | [prev] | [next] | [standalone]

#39543

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-02 09:04 -0800
Message-ID<60a0a5cd-bbfa-47b3-9be4-0c35fa68387cn@googlegroups.com>
In reply to#39542
tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ:
> On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > I have no problem reach parent scripts from iframe.
> I doubt it. At least with the given code.
> > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > 
> > "The PAD0-PAD15" is in the iframe. 
> > 
> > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > 
> > iframe = document.getElementById("VirtualDrum"); 
> > 
> > function writeOptionList(){ 
> > console.log("writeOptionList()"); 
> > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > }
> getElementById() is a method of the document object. 
> Your `iframe` is an element object.
Well i tried  iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
Did not help.

[toc] | [prev] | [next] | [standalone]

#39544

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 02:11 -0800
Message-ID<a1bfd55d-aaf2-416f-96c6-aeb766d7ef35n@googlegroups.com>
In reply to#39543
tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall:
> tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > I have no problem reach parent scripts from iframe. 
> > I doubt it. At least with the given code. 
> > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > 
> > > "The PAD0-PAD15" is in the iframe. 
> > > 
> > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > 
> > > iframe = document.getElementById("VirtualDrum"); 
> > > 
> > > function writeOptionList(){ 
> > > console.log("writeOptionList()"); 
> > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > } 
> > getElementById() is a method of the document object. 
> > Your `iframe` is an element object.
> Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> Did not help.
Found this in W3 school.
What is contentWindow never heard about it before?

var iframe = document.getElementById("myFrame");
var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0];
elmnt.style.display = "none";

?

[toc] | [prev] | [next] | [standalone]

#39545

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 02:26 -0800
Message-ID<b27d41d8-411e-4b0e-84c8-3cbb36dc565bn@googlegroups.com>
In reply to#39544
onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall:
> tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > I have no problem reach parent scripts from iframe. 
> > > I doubt it. At least with the given code. 
> > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > 
> > > > "The PAD0-PAD15" is in the iframe. 
> > > > 
> > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > 
> > > > iframe = document.getElementById("VirtualDrum"); 
> > > > 
> > > > function writeOptionList(){ 
> > > > console.log("writeOptionList()"); 
> > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > } 
> > > getElementById() is a method of the document object. 
> > > Your `iframe` is an element object. 
> > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > Did not help.
> Found this in W3 school. 
> What is contentWindow never heard about it before? 
> 
> var iframe = document.getElementById("myFrame"); 
> var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> elmnt.style.display = "none"; 
> 
> ?
Maybe it is because the iframe not loaded yet?
I will move the initiaition until the drum window open.

Uncaught TypeError: Cannot read property 'document' of null
    at writeOptionList (VIRTdrum.js:103)
    at initDrum (VIRTdrum.js:93)
    at toggleVirtDrum.html:197

[toc] | [prev] | [next] | [standalone]

#39546

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 02:44 -0800
Message-ID<50da40c5-d7d3-42c0-b5a4-28421e7874e4n@googlegroups.com>
In reply to#39545
onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > I have no problem reach parent scripts from iframe. 
> > > > I doubt it. At least with the given code. 
> > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > 
> > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > 
> > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > 
> > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > 
> > > > > function writeOptionList(){ 
> > > > > console.log("writeOptionList()"); 
> > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > } 
> > > > getElementById() is a method of the document object. 
> > > > Your `iframe` is an element object. 
> > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > Did not help. 
> > Found this in W3 school. 
> > What is contentWindow never heard about it before? 
> > 
> > var iframe = document.getElementById("myFrame"); 
> > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > elmnt.style.display = "none"; 
> > 
> > ?
> Maybe it is because the iframe not loaded yet? 
> I will move the initiaition until the drum window open. 
> 
> Uncaught TypeError: Cannot read property 'document' of null 
> at writeOptionList (VIRTdrum.js:103) 
> at initDrum (VIRTdrum.js:93) 
> at toggleVirtDrum.html:197

No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist?

"iframe HTML ending and then script invoked"
	</BODY></HTML>
	
	<script>
	parent.initDrum();
	</script>

[toc] | [prev] | [next] | [standalone]

#39547

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 02:46 -0800
Message-ID<00ecd3fc-1483-4304-a71c-3ec87d76cff3n@googlegroups.com>
In reply to#39546
onsdag 3 mars 2021 kl. 11:44:18 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall: 
> > onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > > I have no problem reach parent scripts from iframe. 
> > > > > I doubt it. At least with the given code. 
> > > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > > 
> > > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > > 
> > > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > > 
> > > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > > 
> > > > > > function writeOptionList(){ 
> > > > > > console.log("writeOptionList()"); 
> > > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > > } 
> > > > > getElementById() is a method of the document object. 
> > > > > Your `iframe` is an element object. 
> > > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > Did not help. 
> > > Found this in W3 school. 
> > > What is contentWindow never heard about it before? 
> > > 
> > > var iframe = document.getElementById("myFrame"); 
> > > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > > elmnt.style.display = "none"; 
> > > 
> > > ? 
> > Maybe it is because the iframe not loaded yet? 
> > I will move the initiaition until the drum window open. 
> > 
> > Uncaught TypeError: Cannot read property 'document' of null 
> > at writeOptionList (VIRTdrum.js:103) 
> > at initDrum (VIRTdrum.js:93) 
> > at toggleVirtDrum.html:197
> No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist? 
> 
> "iframe HTML ending and then script invoked" 
> </BODY></HTML> 
> 
> <script> 
> parent.initDrum(); 
> </script>
iframe = document.getElementById("VirtualDrum");
volumeDR =new Array();
ArrPad =new Array();
bigString=new Array();
STRINGINS="undefined";

function mouseOverDrum(){
	console.log("mouseOverDrum()");
    document.getElementById("keyboardlistener").checked=true;
    checkIfCharNotes(); 
    midiSave=document.getElementById("out_channel").selectedIndex;
    document.getElementById("out_channel").selectedIndex=10-1;
    setTrack(activetrack);
}

function mouseOutDrum(){
	console.log("mouseOutDrum()");
	document.getElementById("keyboardlistener").checked=false; 
	document.getElementById("out_channel").selectedIndex=midiSave;
	setTrack(activetrack);
}

function ListenKeybNote(){
	console.log("ListenKeybNote()");
	var charCode=event.keyCode;
	var A=charCode;
	var B=64;
	var dev="DR";
	drumNote(A,B,dev);
	stateChange(A);
}

function stateChange(A) {
	console.log("statChange()");
    setTimeout(function(){ drumStop(A); }, 10);
}

function createKitOption() {
console.log("createKitOption()");
var i=0;
DrInst="";
for (var i=0;i<16;i++) {
ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n";
}	

for (var j=0;j<127;j++){
STRINGINS=kitName[r];

DrInst+="<option value="+j+"> "+j+"  "+STRINGINS+"</option>\n";
STRINGINS="undefined";
}
optEnd="</select> \n";

for (var i=0;i<16;i++) {
bigString[i]=ArrPad[i]+DrInst+optEnd;
}
//console.log("bigString="+bigString[0]);
}

function createOptionList(){
console.log("createOptionList()");
var i=0;
DrInst="";
for (var i=0;i<16;i++) {
ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n";
}
for (var j=0;j<127;j++){
if(j==23){STRINGINS="BASS";}
if(j==26){STRINGINS="SNARE";}
if(j==25){STRINGINS="RIMSHOT";}
if(j==28){STRINGINS="SNARE 2";}
if(j==29){STRINGINS="TOM1";}
if(j==30){STRINGINS="TOM2";}
if(j==32){STRINGINS="TOM3";}
if(j==27){STRINGINS="HANDCLAP";}
if(j==36){STRINGINS="TAMBURINE";}
if(j==38){STRINGINS="COWBELL";}
if(j==57){STRINGINS="TIMBALE";}
if(j==45){STRINGINS="MARIMBA";}
DrInst+="<option value="+j+"> "+j+"  "+STRINGINS+"</option>\n";
STRINGINS="undefined";
}
optEnd="</select> \n";

for (var i=0;i<16;i++) {
bigString[i]=ArrPad[i]+DrInst+optEnd;
}
//console.log("bigString="+bigString[0]);
}

function initDrum(){
console.log("initDrum()");
createOptionList(); //Create the HTML strings for option list
writeOptionList();  //Write the HTML strings
setPads(); //SET STANDARD INSTRUMENT IN SELECT
selDrum(); // CONNECT INSTRUMENT TO PAD
newDrumVol(); //INITIATE ALL PAD VOLUMES
}

function writeOptionList(){
console.log("writeOptionList()");
	iframe.document.getElementById("PAD0").innerHTML=bigString[0];
	iframe.document.getElementById("PAD1").innerHTML=bigString[1];
	iframe.document.getElementById("PAD2").innerHTML=bigString[2];
	iframe.document.getElementById("PAD3").innerHTML=bigString[3];
	iframe.document.getElementById("PAD4").innerHTML=bigString[4];
	iframe.document.getElementById("PAD5").innerHTML=bigString[5];
	iframe.document.getElementById("PAD6").innerHTML=bigString[6];
	iframe.document.getElementById("PAD7").innerHTML=bigString[7];
	iframe.document.getElementById("PAD8").innerHTML=bigString[8];
	iframe.document.getElementById("PAD9").innerHTML=bigString[9];
	iframe.document.getElementById("PAD10").innerHTML=bigString[10];
	iframe.document.getElementById("PAD11").innerHTML=bigString[11];
	iframe.document.getElementById("PAD12").innerHTML=bigString[12];
	iframe.document.getElementById("PAD13").innerHTML=bigString[13];
	iframe.document.getElementById("PAD14").innerHTML=bigString[14];
	iframe.document.getElementById("PAD15").innerHTML=bigString[15];
}

function setPads(){
console.log("setPads()");
iframe.document.getElementById("dPad0").selectedIndex = "23";//BASS
iframe.document.getElementById("dPad1").selectedIndex = "26";//SNARE
iframe.document.getElementById("dPad2").selectedIndex = "25";//RIMSHOT
iframe.document.getElementById("dPad3").selectedIndex = "28";//SNARE 2
iframe.document.getElementById("dPad4").selectedIndex = "29";//TOM1
iframe.document.getElementById("dPad5").selectedIndex = "30";//TOM2
iframe.document.getElementById("dPad6").selectedIndex = "32";//TOM3
iframe.document.getElementById("dPad7").selectedIndex = "27";//HANDCLAP
iframe.document.getElementById("dPad8").selectedIndex = "36";//TAMBURINE
iframe.document.getElementById("dPad9").selectedIndex = "38";//COWBELL
iframe.document.getElementById("dPad10").selectedIndex = "57";//TIMBALES
iframe.document.getElementById("dPad11").selectedIndex = "45";//MARIMBA
}

function newDrumVol(){
console.log("newDrumVol()");
volumeDR[0]=+iframe.document.getElementById("vol0").value; 
volumeDR[1]=+iframe.document.getElementById("vol1").value; 
volumeDR[2]=+iframe.document.getElementById("vol2").value; 
volumeDR[3]=+iframe.document.getElementById("vol3").value; 
volumeDR[4]=+iframe.document.getElementById("vol4").value; 
volumeDR[5]=+iframe.document.getElementById("vol5").value; 
volumeDR[6]=+iframe.document.getElementById("vol6").value; 
volumeDR[7]=+iframe.document.getElementById("vol7").value; 
volumeDR[8]=+iframe.document.getElementById("vol8").value; 
volumeDR[9]=+iframe.document.getElementById("vol9").value; 
volumeDR[10]=+iframe.document.getElementById("volA").value; 
volumeDR[11]=+iframe.document.getElementById("volB").value; 
volumeDR[12]=+iframe.document.getElementById("volC").value; 
volumeDR[13]=+iframe.document.getElementById("volD").value; 
volumeDR[14]=+iframe.document.getElementById("volE").value; 
volumeDR[15]=+iframe.document.getElementById("volF").value; 
}

function selDrum(){
console.log("selDrum()");
DRUM0=iframe.document.getElementById('dPad0').value;
DRUM1=iframe.document.getElementById('dPad1').value;
DRUM2=iframe.document.getElementById('dPad2').value;
DRUM3=iframe.document.getElementById('dPad3').value;
DRUM4=iframe.document.getElementById('dPad4').value;
DRUM5=iframe.document.getElementById('dPad5').value;
DRUM6=iframe.document.getElementById('dPad6').value;
DRUM7=iframe.document.getElementById('dPad7').value;
DRUM8=iframe.document.getElementById('dPad8').value;
DRUM9=iframe.document.getElementById('dPad9').value;
DRUM10=iframe.document.getElementById('dPad10').value;
DRUM11=iframe.document.getElementById('dPad11').value;
DRUM12=iframe.document.getElementById('dPad12').value;
DRUM13=iframe.document.getElementById('dPad13').value;
DRUM14=iframe.document.getElementById('dPad14').value;
DRUM15=iframe.document.getElementById('dPad15').value;
}

function drumStop(X){
console.log("drumStop()");
if (X==48){X=DRUM0;stopNote(X);}
else if (X==49){X=DRUM1;stopNote(X);}
else if (X==50){X=DRUM2;stopNote(X);}
else if (X==51){X=DRUM3;stopNote(X);}
else if (X==52){X=DRUM4;stopNote(X);}
else if (X==53){X=DRUM5;stopNote(X);}
else if (X==54){X=DRUM6;stopNote(X);}
else if (X==55){X=DRUM7;stopNote(X);}
else if (X==56){X=DRUM8;stopNote(X);}
else if (X==57){X=DRUM9;stopNote(X);}
else if (X==65){X=DRUM10;stopNote(X);}
else if (X==66){X=DRUM11;stopNote(X);}
else if (X==67){X=DRUM12;stopNote(X);}
else if (X==68){X=DRUM13;stopNote(X);}
else if (X==69){X=DRUM14;stopNote(X);}
else if (X==70){X=DRUM15;stopNote(X);}
}

function drumNote(X,Y,Z){
console.log("drumNote()");
if (X==48){X=DRUM0;playNote(X,volumeDR[0],"DR");}
if (X==49){X=DRUM1;playNote(X,volumeDR[1],"DR");}
if (X==50){X=DRUM2;playNote(X,volumeDR[2],"DR");}
if (X==51){X=DRUM3;playNote(X,volumeDR[3],"DR");}
if (X==52){X=DRUM4;playNote(X,volumeDR[4],"DR");}
if (X==53){X=DRUM5;playNote(X,volumeDR[5],"DR");}
if (X==54){X=DRUM6;playNote(X,volumeDR[6],"DR");}
if (X==55){X=DRUM7;playNote(X,volumeDR[7],"DR");}
if (X==56){X=DRUM8;playNote(X,volumeDR[8],"DR");}
if (X==57){X=DRUM9;playNote(X,volumeDR[9],"DR");}
if (X==65){X=DRUM10;playNote(X,volumeDR[10],"DR");}
if (X==66){X=DRUM11;playNote(X,volumeDR[11],"DR");}
if (X==67){X=DRUM12;playNote(X,volumeDR[12],"DR");}
if (X==68){X=DRUM13;playNote(X,volumeDR[13],"DR");}
if (X==69){X=DRUM14;playNote(X,volumeDR[14],"DR");}
if (X==70){X=DRUM15;playNote(X,volumeDR[15],"DR");}
}

[toc] | [prev] | [next] | [standalone]

#39548

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 02:58 -0800
Message-ID<a01f5ed5-df8e-467e-91b0-a1d0cb1e38ban@googlegroups.com>
In reply to#39547
onsdag 3 mars 2021 kl. 11:46:36 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:44:18 UTC+1 skrev Jonas Thörnvall: 
> > onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall: 
> > > onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > > > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > > > I have no problem reach parent scripts from iframe. 
> > > > > > I doubt it. At least with the given code. 
> > > > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > > > 
> > > > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > > > 
> > > > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > > > 
> > > > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > > > 
> > > > > > > function writeOptionList(){ 
> > > > > > > console.log("writeOptionList()"); 
> > > > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > > > } 
> > > > > > getElementById() is a method of the document object. 
> > > > > > Your `iframe` is an element object. 
> > > > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > Did not help. 
> > > > Found this in W3 school. 
> > > > What is contentWindow never heard about it before? 
> > > > 
> > > > var iframe = document.getElementById("myFrame"); 
> > > > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > > > elmnt.style.display = "none"; 
> > > > 
> > > > ? 
> > > Maybe it is because the iframe not loaded yet? 
> > > I will move the initiaition until the drum window open. 
> > > 
> > > Uncaught TypeError: Cannot read property 'document' of null 
> > > at writeOptionList (VIRTdrum.js:103) 
> > > at initDrum (VIRTdrum.js:93) 
> > > at toggleVirtDrum.html:197 
> > No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist? 
> > 
> > "iframe HTML ending and then script invoked" 
> > </BODY></HTML> 
> > 
> > <script> 
> > parent.initDrum(); 
> > </script> 
> iframe = document.getElementById("VirtualDrum");
> volumeDR =new Array(); 
> ArrPad =new Array(); 
> bigString=new Array(); 
> STRINGINS="undefined"; 
> 
> function mouseOverDrum(){ 
> console.log("mouseOverDrum()"); 
> document.getElementById("keyboardlistener").checked=true; 
> checkIfCharNotes(); 
> midiSave=document.getElementById("out_channel").selectedIndex; 
> document.getElementById("out_channel").selectedIndex=10-1; 
> setTrack(activetrack); 
> } 
> 
> function mouseOutDrum(){ 
> console.log("mouseOutDrum()"); 
> document.getElementById("keyboardlistener").checked=false; 
> document.getElementById("out_channel").selectedIndex=midiSave; 
> setTrack(activetrack); 
> } 
> 
> function ListenKeybNote(){ 
> console.log("ListenKeybNote()"); 
> var charCode=event.keyCode; 
> var A=charCode; 
> var B=64; 
> var dev="DR"; 
> drumNote(A,B,dev); 
> stateChange(A); 
> } 
> 
> function stateChange(A) { 
> console.log("statChange()"); 
> setTimeout(function(){ drumStop(A); }, 10); 
> } 
> 
> function createKitOption() { 
> console.log("createKitOption()"); 
> var i=0; 
> DrInst=""; 
> for (var i=0;i<16;i++) { 
> ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n"; 
> } 
> 
> for (var j=0;j<127;j++){ 
> STRINGINS=kitName[r]; 
> 
> DrInst+="<option value="+j+"> "+j+" "+STRINGINS+"</option>\n"; 
> STRINGINS="undefined"; 
> } 
> optEnd="</select> \n"; 
> 
> for (var i=0;i<16;i++) { 
> bigString[i]=ArrPad[i]+DrInst+optEnd; 
> } 
> //console.log("bigString="+bigString[0]); 
> } 
> 
> function createOptionList(){ 
> console.log("createOptionList()"); 
> var i=0; 
> DrInst=""; 
> for (var i=0;i<16;i++) { 
> ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n"; 
> } 
> for (var j=0;j<127;j++){ 
> if(j==23){STRINGINS="BASS";} 
> if(j==26){STRINGINS="SNARE";} 
> if(j==25){STRINGINS="RIMSHOT";} 
> if(j==28){STRINGINS="SNARE 2";} 
> if(j==29){STRINGINS="TOM1";} 
> if(j==30){STRINGINS="TOM2";} 
> if(j==32){STRINGINS="TOM3";} 
> if(j==27){STRINGINS="HANDCLAP";} 
> if(j==36){STRINGINS="TAMBURINE";} 
> if(j==38){STRINGINS="COWBELL";} 
> if(j==57){STRINGINS="TIMBALE";} 
> if(j==45){STRINGINS="MARIMBA";} 
> DrInst+="<option value="+j+"> "+j+" "+STRINGINS+"</option>\n"; 
> STRINGINS="undefined"; 
> } 
> optEnd="</select> \n"; 
> 
> for (var i=0;i<16;i++) { 
> bigString[i]=ArrPad[i]+DrInst+optEnd; 
> } 
> //console.log("bigString="+bigString[0]); 
> } 
> 
> function initDrum(){ 
> console.log("initDrum()"); 
> createOptionList(); //Create the HTML strings for option list 
> writeOptionList(); //Write the HTML strings 
> setPads(); //SET STANDARD INSTRUMENT IN SELECT 
> selDrum(); // CONNECT INSTRUMENT TO PAD 
> newDrumVol(); //INITIATE ALL PAD VOLUMES
> } 
> 
> function writeOptionList(){ 
> console.log("writeOptionList()");
> iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> iframe.document.getElementById("PAD1").innerHTML=bigString[1]; 
> iframe.document.getElementById("PAD2").innerHTML=bigString[2]; 
> iframe.document.getElementById("PAD3").innerHTML=bigString[3]; 
> iframe.document.getElementById("PAD4").innerHTML=bigString[4]; 
> iframe.document.getElementById("PAD5").innerHTML=bigString[5]; 
> iframe.document.getElementById("PAD6").innerHTML=bigString[6]; 
> iframe.document.getElementById("PAD7").innerHTML=bigString[7]; 
> iframe.document.getElementById("PAD8").innerHTML=bigString[8]; 
> iframe.document.getElementById("PAD9").innerHTML=bigString[9]; 
> iframe.document.getElementById("PAD10").innerHTML=bigString[10]; 
> iframe.document.getElementById("PAD11").innerHTML=bigString[11]; 
> iframe.document.getElementById("PAD12").innerHTML=bigString[12]; 
> iframe.document.getElementById("PAD13").innerHTML=bigString[13]; 
> iframe.document.getElementById("PAD14").innerHTML=bigString[14]; 
> iframe.document.getElementById("PAD15").innerHTML=bigString[15]; 
> } 
> 
> function setPads(){ 
> console.log("setPads()"); 
> iframe.document.getElementById("dPad0").selectedIndex = "23";//BASS 
> iframe.document.getElementById("dPad1").selectedIndex = "26";//SNARE 
> iframe.document.getElementById("dPad2").selectedIndex = "25";//RIMSHOT 
> iframe.document.getElementById("dPad3").selectedIndex = "28";//SNARE 2 
> iframe.document.getElementById("dPad4").selectedIndex = "29";//TOM1 
> iframe.document.getElementById("dPad5").selectedIndex = "30";//TOM2 
> iframe.document.getElementById("dPad6").selectedIndex = "32";//TOM3 
> iframe.document.getElementById("dPad7").selectedIndex = "27";//HANDCLAP 
> iframe.document.getElementById("dPad8").selectedIndex = "36";//TAMBURINE 
> iframe.document.getElementById("dPad9").selectedIndex = "38";//COWBELL 
> iframe.document.getElementById("dPad10").selectedIndex = "57";//TIMBALES 
> iframe.document.getElementById("dPad11").selectedIndex = "45";//MARIMBA 
> } 
> 
> function newDrumVol(){ 
> console.log("newDrumVol()"); 
> volumeDR[0]=+iframe.document.getElementById("vol0").value; 
> volumeDR[1]=+iframe.document.getElementById("vol1").value; 
> volumeDR[2]=+iframe.document.getElementById("vol2").value; 
> volumeDR[3]=+iframe.document.getElementById("vol3").value; 
> volumeDR[4]=+iframe.document.getElementById("vol4").value; 
> volumeDR[5]=+iframe.document.getElementById("vol5").value; 
> volumeDR[6]=+iframe.document.getElementById("vol6").value; 
> volumeDR[7]=+iframe.document.getElementById("vol7").value; 
> volumeDR[8]=+iframe.document.getElementById("vol8").value; 
> volumeDR[9]=+iframe.document.getElementById("vol9").value; 
> volumeDR[10]=+iframe.document.getElementById("volA").value; 
> volumeDR[11]=+iframe.document.getElementById("volB").value; 
> volumeDR[12]=+iframe.document.getElementById("volC").value; 
> volumeDR[13]=+iframe.document.getElementById("volD").value; 
> volumeDR[14]=+iframe.document.getElementById("volE").value; 
> volumeDR[15]=+iframe.document.getElementById("volF").value; 
> } 
> 
> function selDrum(){ 
> console.log("selDrum()"); 
> DRUM0=iframe.document.getElementById('dPad0').value; 
> DRUM1=iframe.document.getElementById('dPad1').value; 
> DRUM2=iframe.document.getElementById('dPad2').value; 
> DRUM3=iframe.document.getElementById('dPad3').value; 
> DRUM4=iframe.document.getElementById('dPad4').value; 
> DRUM5=iframe.document.getElementById('dPad5').value; 
> DRUM6=iframe.document.getElementById('dPad6').value; 
> DRUM7=iframe.document.getElementById('dPad7').value; 
> DRUM8=iframe.document.getElementById('dPad8').value; 
> DRUM9=iframe.document.getElementById('dPad9').value; 
> DRUM10=iframe.document.getElementById('dPad10').value; 
> DRUM11=iframe.document.getElementById('dPad11').value; 
> DRUM12=iframe.document.getElementById('dPad12').value; 
> DRUM13=iframe.document.getElementById('dPad13').value; 
> DRUM14=iframe.document.getElementById('dPad14').value; 
> DRUM15=iframe.document.getElementById('dPad15').value; 
> } 
> 
> function drumStop(X){ 
> console.log("drumStop()"); 
> if (X==48){X=DRUM0;stopNote(X);} 
> else if (X==49){X=DRUM1;stopNote(X);} 
> else if (X==50){X=DRUM2;stopNote(X);} 
> else if (X==51){X=DRUM3;stopNote(X);} 
> else if (X==52){X=DRUM4;stopNote(X);} 
> else if (X==53){X=DRUM5;stopNote(X);} 
> else if (X==54){X=DRUM6;stopNote(X);} 
> else if (X==55){X=DRUM7;stopNote(X);} 
> else if (X==56){X=DRUM8;stopNote(X);} 
> else if (X==57){X=DRUM9;stopNote(X);} 
> else if (X==65){X=DRUM10;stopNote(X);} 
> else if (X==66){X=DRUM11;stopNote(X);} 
> else if (X==67){X=DRUM12;stopNote(X);} 
> else if (X==68){X=DRUM13;stopNote(X);} 
> else if (X==69){X=DRUM14;stopNote(X);} 
> else if (X==70){X=DRUM15;stopNote(X);} 
> } 
> 
> function drumNote(X,Y,Z){ 
> console.log("drumNote()"); 
> if (X==48){X=DRUM0;playNote(X,volumeDR[0],"DR");} 
> if (X==49){X=DRUM1;playNote(X,volumeDR[1],"DR");} 
> if (X==50){X=DRUM2;playNote(X,volumeDR[2],"DR");} 
> if (X==51){X=DRUM3;playNote(X,volumeDR[3],"DR");} 
> if (X==52){X=DRUM4;playNote(X,volumeDR[4],"DR");} 
> if (X==53){X=DRUM5;playNote(X,volumeDR[5],"DR");} 
> if (X==54){X=DRUM6;playNote(X,volumeDR[6],"DR");} 
> if (X==55){X=DRUM7;playNote(X,volumeDR[7],"DR");} 
> if (X==56){X=DRUM8;playNote(X,volumeDR[8],"DR");} 
> if (X==57){X=DRUM9;playNote(X,volumeDR[9],"DR");} 
> if (X==65){X=DRUM10;playNote(X,volumeDR[10],"DR");} 
> if (X==66){X=DRUM11;playNote(X,volumeDR[11],"DR");} 
> if (X==67){X=DRUM12;playNote(X,volumeDR[12],"DR");} 
> if (X==68){X=DRUM13;playNote(X,volumeDR[13],"DR");} 
> if (X==69){X=DRUM14;playNote(X,volumeDR[14],"DR");} 
> if (X==70){X=DRUM15;playNote(X,volumeDR[15],"DR");} 
> }
Changed to this just to be sure it is like the elements i refer to do not exist in iframe or the iframe do not exist?

function initDrum(){
console.log("initDrum()");
setTimeout(Druminit,5000);
}

function Druminit(){
	createOptionList(); //Create the HTML strings for option list
	writeOptionList();  //Write the HTML strings
	setPads(); //SET STANDARD INSTRUMENT IN SELECT
	selDrum(); // CONNECT INSTRUMENT TO PAD
	newDrumVol(); //INITIATE ALL PAD VOLUMES
}

[toc] | [prev] | [next] | [standalone]

#39549

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 03:12 -0800
Message-ID<7c69d9ca-5846-4728-894f-15b46c0f73d9n@googlegroups.com>
In reply to#39548
onsdag 3 mars 2021 kl. 11:58:46 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:46:36 UTC+1 skrev Jonas Thörnvall: 
> > onsdag 3 mars 2021 kl. 11:44:18 UTC+1 skrev Jonas Thörnvall: 
> > > onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall: 
> > > > onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > > > > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > > > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > > > > I have no problem reach parent scripts from iframe. 
> > > > > > > I doubt it. At least with the given code. 
> > > > > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > > > > 
> > > > > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > > > > 
> > > > > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > > > > 
> > > > > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > > > > 
> > > > > > > > function writeOptionList(){ 
> > > > > > > > console.log("writeOptionList()"); 
> > > > > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > > > > } 
> > > > > > > getElementById() is a method of the document object. 
> > > > > > > Your `iframe` is an element object. 
> > > > > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > Did not help. 
> > > > > Found this in W3 school. 
> > > > > What is contentWindow never heard about it before? 
> > > > > 
> > > > > var iframe = document.getElementById("myFrame"); 
> > > > > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > > > > elmnt.style.display = "none"; 
> > > > > 
> > > > > ? 
> > > > Maybe it is because the iframe not loaded yet? 
> > > > I will move the initiaition until the drum window open. 
> > > > 
> > > > Uncaught TypeError: Cannot read property 'document' of null 
> > > > at writeOptionList (VIRTdrum.js:103) 
> > > > at initDrum (VIRTdrum.js:93) 
> > > > at toggleVirtDrum.html:197 
> > > No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist? 
> > > 
> > > "iframe HTML ending and then script invoked" 
> > > </BODY></HTML> 
> > > 
> > > <script> 
> > > parent.initDrum(); 
> > > </script> 
> > iframe = document.getElementById("VirtualDrum"); 
> > volumeDR =new Array(); 
> > ArrPad =new Array(); 
> > bigString=new Array(); 
> > STRINGINS="undefined"; 
> > 
> > function mouseOverDrum(){ 
> > console.log("mouseOverDrum()"); 
> > document.getElementById("keyboardlistener").checked=true; 
> > checkIfCharNotes(); 
> > midiSave=document.getElementById("out_channel").selectedIndex; 
> > document.getElementById("out_channel").selectedIndex=10-1; 
> > setTrack(activetrack); 
> > } 
> > 
> > function mouseOutDrum(){ 
> > console.log("mouseOutDrum()"); 
> > document.getElementById("keyboardlistener").checked=false; 
> > document.getElementById("out_channel").selectedIndex=midiSave; 
> > setTrack(activetrack); 
> > } 
> > 
> > function ListenKeybNote(){ 
> > console.log("ListenKeybNote()"); 
> > var charCode=event.keyCode; 
> > var A=charCode; 
> > var B=64; 
> > var dev="DR"; 
> > drumNote(A,B,dev); 
> > stateChange(A); 
> > } 
> > 
> > function stateChange(A) { 
> > console.log("statChange()"); 
> > setTimeout(function(){ drumStop(A); }, 10); 
> > } 
> > 
> > function createKitOption() { 
> > console.log("createKitOption()"); 
> > var i=0; 
> > DrInst=""; 
> > for (var i=0;i<16;i++) { 
> > ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n"; 
> > } 
> > 
> > for (var j=0;j<127;j++){ 
> > STRINGINS=kitName[r]; 
> > 
> > DrInst+="<option value="+j+"> "+j+" "+STRINGINS+"</option>\n"; 
> > STRINGINS="undefined"; 
> > } 
> > optEnd="</select> \n"; 
> > 
> > for (var i=0;i<16;i++) { 
> > bigString[i]=ArrPad[i]+DrInst+optEnd; 
> > } 
> > //console.log("bigString="+bigString[0]); 
> > } 
> > 
> > function createOptionList(){ 
> > console.log("createOptionList()"); 
> > var i=0; 
> > DrInst=""; 
> > for (var i=0;i<16;i++) { 
> > ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n"; 
> > } 
> > for (var j=0;j<127;j++){ 
> > if(j==23){STRINGINS="BASS";} 
> > if(j==26){STRINGINS="SNARE";} 
> > if(j==25){STRINGINS="RIMSHOT";} 
> > if(j==28){STRINGINS="SNARE 2";} 
> > if(j==29){STRINGINS="TOM1";} 
> > if(j==30){STRINGINS="TOM2";} 
> > if(j==32){STRINGINS="TOM3";} 
> > if(j==27){STRINGINS="HANDCLAP";} 
> > if(j==36){STRINGINS="TAMBURINE";} 
> > if(j==38){STRINGINS="COWBELL";} 
> > if(j==57){STRINGINS="TIMBALE";} 
> > if(j==45){STRINGINS="MARIMBA";} 
> > DrInst+="<option value="+j+"> "+j+" "+STRINGINS+"</option>\n"; 
> > STRINGINS="undefined"; 
> > } 
> > optEnd="</select> \n"; 
> > 
> > for (var i=0;i<16;i++) { 
> > bigString[i]=ArrPad[i]+DrInst+optEnd; 
> > } 
> > //console.log("bigString="+bigString[0]); 
> > } 
> > 
> > function initDrum(){ 
> > console.log("initDrum()"); 
> > createOptionList(); //Create the HTML strings for option list 
> > writeOptionList(); //Write the HTML strings 
> > setPads(); //SET STANDARD INSTRUMENT IN SELECT 
> > selDrum(); // CONNECT INSTRUMENT TO PAD 
> > newDrumVol(); //INITIATE ALL PAD VOLUMES 
> > } 
> > 
> > function writeOptionList(){ 
> > console.log("writeOptionList()"); 
> > iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > iframe.document.getElementById("PAD1").innerHTML=bigString[1]; 
> > iframe.document.getElementById("PAD2").innerHTML=bigString[2]; 
> > iframe.document.getElementById("PAD3").innerHTML=bigString[3]; 
> > iframe.document.getElementById("PAD4").innerHTML=bigString[4]; 
> > iframe.document.getElementById("PAD5").innerHTML=bigString[5]; 
> > iframe.document.getElementById("PAD6").innerHTML=bigString[6]; 
> > iframe.document.getElementById("PAD7").innerHTML=bigString[7]; 
> > iframe.document.getElementById("PAD8").innerHTML=bigString[8]; 
> > iframe.document.getElementById("PAD9").innerHTML=bigString[9]; 
> > iframe.document.getElementById("PAD10").innerHTML=bigString[10]; 
> > iframe.document.getElementById("PAD11").innerHTML=bigString[11]; 
> > iframe.document.getElementById("PAD12").innerHTML=bigString[12]; 
> > iframe.document.getElementById("PAD13").innerHTML=bigString[13]; 
> > iframe.document.getElementById("PAD14").innerHTML=bigString[14]; 
> > iframe.document.getElementById("PAD15").innerHTML=bigString[15]; 
> > } 
> > 
> > function setPads(){ 
> > console.log("setPads()"); 
> > iframe.document.getElementById("dPad0").selectedIndex = "23";//BASS 
> > iframe.document.getElementById("dPad1").selectedIndex = "26";//SNARE 
> > iframe.document.getElementById("dPad2").selectedIndex = "25";//RIMSHOT 
> > iframe.document.getElementById("dPad3").selectedIndex = "28";//SNARE 2 
> > iframe.document.getElementById("dPad4").selectedIndex = "29";//TOM1 
> > iframe.document.getElementById("dPad5").selectedIndex = "30";//TOM2 
> > iframe.document.getElementById("dPad6").selectedIndex = "32";//TOM3 
> > iframe.document.getElementById("dPad7").selectedIndex = "27";//HANDCLAP 
> > iframe.document.getElementById("dPad8").selectedIndex = "36";//TAMBURINE 
> > iframe.document.getElementById("dPad9").selectedIndex = "38";//COWBELL 
> > iframe.document.getElementById("dPad10").selectedIndex = "57";//TIMBALES 
> > iframe.document.getElementById("dPad11").selectedIndex = "45";//MARIMBA 
> > } 
> > 
> > function newDrumVol(){ 
> > console.log("newDrumVol()"); 
> > volumeDR[0]=+iframe.document.getElementById("vol0").value; 
> > volumeDR[1]=+iframe.document.getElementById("vol1").value; 
> > volumeDR[2]=+iframe.document.getElementById("vol2").value; 
> > volumeDR[3]=+iframe.document.getElementById("vol3").value; 
> > volumeDR[4]=+iframe.document.getElementById("vol4").value; 
> > volumeDR[5]=+iframe.document.getElementById("vol5").value; 
> > volumeDR[6]=+iframe.document.getElementById("vol6").value; 
> > volumeDR[7]=+iframe.document.getElementById("vol7").value; 
> > volumeDR[8]=+iframe.document.getElementById("vol8").value; 
> > volumeDR[9]=+iframe.document.getElementById("vol9").value; 
> > volumeDR[10]=+iframe.document.getElementById("volA").value; 
> > volumeDR[11]=+iframe.document.getElementById("volB").value; 
> > volumeDR[12]=+iframe.document.getElementById("volC").value; 
> > volumeDR[13]=+iframe.document.getElementById("volD").value; 
> > volumeDR[14]=+iframe.document.getElementById("volE").value; 
> > volumeDR[15]=+iframe.document.getElementById("volF").value; 
> > } 
> > 
> > function selDrum(){ 
> > console.log("selDrum()"); 
> > DRUM0=iframe.document.getElementById('dPad0').value; 
> > DRUM1=iframe.document.getElementById('dPad1').value; 
> > DRUM2=iframe.document.getElementById('dPad2').value; 
> > DRUM3=iframe.document.getElementById('dPad3').value; 
> > DRUM4=iframe.document.getElementById('dPad4').value; 
> > DRUM5=iframe.document.getElementById('dPad5').value; 
> > DRUM6=iframe.document.getElementById('dPad6').value; 
> > DRUM7=iframe.document.getElementById('dPad7').value; 
> > DRUM8=iframe.document.getElementById('dPad8').value; 
> > DRUM9=iframe.document.getElementById('dPad9').value; 
> > DRUM10=iframe.document.getElementById('dPad10').value; 
> > DRUM11=iframe.document.getElementById('dPad11').value; 
> > DRUM12=iframe.document.getElementById('dPad12').value; 
> > DRUM13=iframe.document.getElementById('dPad13').value; 
> > DRUM14=iframe.document.getElementById('dPad14').value; 
> > DRUM15=iframe.document.getElementById('dPad15').value; 
> > } 
> > 
> > function drumStop(X){ 
> > console.log("drumStop()"); 
> > if (X==48){X=DRUM0;stopNote(X);} 
> > else if (X==49){X=DRUM1;stopNote(X);} 
> > else if (X==50){X=DRUM2;stopNote(X);} 
> > else if (X==51){X=DRUM3;stopNote(X);} 
> > else if (X==52){X=DRUM4;stopNote(X);} 
> > else if (X==53){X=DRUM5;stopNote(X);} 
> > else if (X==54){X=DRUM6;stopNote(X);} 
> > else if (X==55){X=DRUM7;stopNote(X);} 
> > else if (X==56){X=DRUM8;stopNote(X);} 
> > else if (X==57){X=DRUM9;stopNote(X);} 
> > else if (X==65){X=DRUM10;stopNote(X);} 
> > else if (X==66){X=DRUM11;stopNote(X);} 
> > else if (X==67){X=DRUM12;stopNote(X);} 
> > else if (X==68){X=DRUM13;stopNote(X);} 
> > else if (X==69){X=DRUM14;stopNote(X);} 
> > else if (X==70){X=DRUM15;stopNote(X);} 
> > } 
> > 
> > function drumNote(X,Y,Z){ 
> > console.log("drumNote()"); 
> > if (X==48){X=DRUM0;playNote(X,volumeDR[0],"DR");} 
> > if (X==49){X=DRUM1;playNote(X,volumeDR[1],"DR");} 
> > if (X==50){X=DRUM2;playNote(X,volumeDR[2],"DR");} 
> > if (X==51){X=DRUM3;playNote(X,volumeDR[3],"DR");} 
> > if (X==52){X=DRUM4;playNote(X,volumeDR[4],"DR");} 
> > if (X==53){X=DRUM5;playNote(X,volumeDR[5],"DR");} 
> > if (X==54){X=DRUM6;playNote(X,volumeDR[6],"DR");} 
> > if (X==55){X=DRUM7;playNote(X,volumeDR[7],"DR");} 
> > if (X==56){X=DRUM8;playNote(X,volumeDR[8],"DR");} 
> > if (X==57){X=DRUM9;playNote(X,volumeDR[9],"DR");} 
> > if (X==65){X=DRUM10;playNote(X,volumeDR[10],"DR");} 
> > if (X==66){X=DRUM11;playNote(X,volumeDR[11],"DR");} 
> > if (X==67){X=DRUM12;playNote(X,volumeDR[12],"DR");} 
> > if (X==68){X=DRUM13;playNote(X,volumeDR[13],"DR");} 
> > if (X==69){X=DRUM14;playNote(X,volumeDR[14],"DR");} 
> > if (X==70){X=DRUM15;playNote(X,volumeDR[15],"DR");} 
> > }
> Changed to this just to be sure it is like the elements i refer to do not exist in iframe or the iframe do not exist?
> function initDrum(){ 
> console.log("initDrum()");
> setTimeout(Druminit,5000); 
> } 
> 
> function Druminit(){
> createOptionList(); //Create the HTML strings for option list 
> writeOptionList(); //Write the HTML strings 
> setPads(); //SET STANDARD INSTRUMENT IN SELECT 
> selDrum(); // CONNECT INSTRUMENT TO PAD 
> newDrumVol(); //INITIATE ALL PAD VOLUMES 
> }

I kind of hate this referential garbage, when it is not even necessary, it is basicly same document but you do not want a file that so big you can not possibly overview it.
Does it matter the iframe is within div,its a drag and drop div with a button?

<div id=drumContainer>
		<div id="drumHeader">Virtual Drums
			<iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe>
			<button onClick="toggleVirtDrum();"><B>X</B></button></div>
		</div>
</div>

[toc] | [prev] | [next] | [standalone]

#39550

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 03:14 -0800
Message-ID<7a282c75-f01d-4be9-97a6-7d26f2c8f2d0n@googlegroups.com>
In reply to#39549
onsdag 3 mars 2021 kl. 12:12:47 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:58:46 UTC+1 skrev Jonas Thörnvall: 
> > onsdag 3 mars 2021 kl. 11:46:36 UTC+1 skrev Jonas Thörnvall: 
> > > onsdag 3 mars 2021 kl. 11:44:18 UTC+1 skrev Jonas Thörnvall: 
> > > > onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall: 
> > > > > onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > > > > > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > > > > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > > > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > > > > > I have no problem reach parent scripts from iframe. 
> > > > > > > > I doubt it. At least with the given code. 
> > > > > > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > > > > > 
> > > > > > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > > > > > 
> > > > > > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > > > > > 
> > > > > > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > > > > > 
> > > > > > > > > function writeOptionList(){ 
> > > > > > > > > console.log("writeOptionList()"); 
> > > > > > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > > > > > } 
> > > > > > > > getElementById() is a method of the document object. 
> > > > > > > > Your `iframe` is an element object. 
> > > > > > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > > Did not help. 
> > > > > > Found this in W3 school. 
> > > > > > What is contentWindow never heard about it before? 
> > > > > > 
> > > > > > var iframe = document.getElementById("myFrame"); 
> > > > > > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > > > > > elmnt.style.display = "none"; 
> > > > > > 
> > > > > > ? 
> > > > > Maybe it is because the iframe not loaded yet? 
> > > > > I will move the initiaition until the drum window open. 
> > > > > 
> > > > > Uncaught TypeError: Cannot read property 'document' of null 
> > > > > at writeOptionList (VIRTdrum.js:103) 
> > > > > at initDrum (VIRTdrum.js:93) 
> > > > > at toggleVirtDrum.html:197 
> > > > No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist? 
> > > > 
> > > > "iframe HTML ending and then script invoked" 
> > > > </BODY></HTML> 
> > > > 
> > > > <script> 
> > > > parent.initDrum(); 
> > > > </script> 
> > > iframe = document.getElementById("VirtualDrum"); 
> > > volumeDR =new Array(); 
> > > ArrPad =new Array(); 
> > > bigString=new Array(); 
> > > STRINGINS="undefined"; 
> > > 
> > > function mouseOverDrum(){ 
> > > console.log("mouseOverDrum()"); 
> > > document.getElementById("keyboardlistener").checked=true; 
> > > checkIfCharNotes(); 
> > > midiSave=document.getElementById("out_channel").selectedIndex; 
> > > document.getElementById("out_channel").selectedIndex=10-1; 
> > > setTrack(activetrack); 
> > > } 
> > > 
> > > function mouseOutDrum(){ 
> > > console.log("mouseOutDrum()"); 
> > > document.getElementById("keyboardlistener").checked=false; 
> > > document.getElementById("out_channel").selectedIndex=midiSave; 
> > > setTrack(activetrack); 
> > > } 
> > > 
> > > function ListenKeybNote(){ 
> > > console.log("ListenKeybNote()"); 
> > > var charCode=event.keyCode; 
> > > var A=charCode; 
> > > var B=64; 
> > > var dev="DR"; 
> > > drumNote(A,B,dev); 
> > > stateChange(A); 
> > > } 
> > > 
> > > function stateChange(A) { 
> > > console.log("statChange()"); 
> > > setTimeout(function(){ drumStop(A); }, 10); 
> > > } 
> > > 
> > > function createKitOption() { 
> > > console.log("createKitOption()"); 
> > > var i=0; 
> > > DrInst=""; 
> > > for (var i=0;i<16;i++) { 
> > > ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n"; 
> > > } 
> > > 
> > > for (var j=0;j<127;j++){ 
> > > STRINGINS=kitName[r]; 
> > > 
> > > DrInst+="<option value="+j+"> "+j+" "+STRINGINS+"</option>\n"; 
> > > STRINGINS="undefined"; 
> > > } 
> > > optEnd="</select> \n"; 
> > > 
> > > for (var i=0;i<16;i++) { 
> > > bigString[i]=ArrPad[i]+DrInst+optEnd; 
> > > } 
> > > //console.log("bigString="+bigString[0]); 
> > > } 
> > > 
> > > function createOptionList(){ 
> > > console.log("createOptionList()"); 
> > > var i=0; 
> > > DrInst=""; 
> > > for (var i=0;i<16;i++) { 
> > > ArrPad[i] ="<select id=dPad"+i+" onChange='selDrum()'>\n"; 
> > > } 
> > > for (var j=0;j<127;j++){ 
> > > if(j==23){STRINGINS="BASS";} 
> > > if(j==26){STRINGINS="SNARE";} 
> > > if(j==25){STRINGINS="RIMSHOT";} 
> > > if(j==28){STRINGINS="SNARE 2";} 
> > > if(j==29){STRINGINS="TOM1";} 
> > > if(j==30){STRINGINS="TOM2";} 
> > > if(j==32){STRINGINS="TOM3";} 
> > > if(j==27){STRINGINS="HANDCLAP";} 
> > > if(j==36){STRINGINS="TAMBURINE";} 
> > > if(j==38){STRINGINS="COWBELL";} 
> > > if(j==57){STRINGINS="TIMBALE";} 
> > > if(j==45){STRINGINS="MARIMBA";} 
> > > DrInst+="<option value="+j+"> "+j+" "+STRINGINS+"</option>\n"; 
> > > STRINGINS="undefined"; 
> > > } 
> > > optEnd="</select> \n"; 
> > > 
> > > for (var i=0;i<16;i++) { 
> > > bigString[i]=ArrPad[i]+DrInst+optEnd; 
> > > } 
> > > //console.log("bigString="+bigString[0]); 
> > > } 
> > > 
> > > function initDrum(){ 
> > > console.log("initDrum()"); 
> > > createOptionList(); //Create the HTML strings for option list 
> > > writeOptionList(); //Write the HTML strings 
> > > setPads(); //SET STANDARD INSTRUMENT IN SELECT 
> > > selDrum(); // CONNECT INSTRUMENT TO PAD 
> > > newDrumVol(); //INITIATE ALL PAD VOLUMES 
> > > } 
> > > 
> > > function writeOptionList(){ 
> > > console.log("writeOptionList()"); 
> > > iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > iframe.document.getElementById("PAD1").innerHTML=bigString[1]; 
> > > iframe.document.getElementById("PAD2").innerHTML=bigString[2]; 
> > > iframe.document.getElementById("PAD3").innerHTML=bigString[3]; 
> > > iframe.document.getElementById("PAD4").innerHTML=bigString[4]; 
> > > iframe.document.getElementById("PAD5").innerHTML=bigString[5]; 
> > > iframe.document.getElementById("PAD6").innerHTML=bigString[6]; 
> > > iframe.document.getElementById("PAD7").innerHTML=bigString[7]; 
> > > iframe.document.getElementById("PAD8").innerHTML=bigString[8]; 
> > > iframe.document.getElementById("PAD9").innerHTML=bigString[9]; 
> > > iframe.document.getElementById("PAD10").innerHTML=bigString[10]; 
> > > iframe.document.getElementById("PAD11").innerHTML=bigString[11]; 
> > > iframe.document.getElementById("PAD12").innerHTML=bigString[12]; 
> > > iframe.document.getElementById("PAD13").innerHTML=bigString[13]; 
> > > iframe.document.getElementById("PAD14").innerHTML=bigString[14]; 
> > > iframe.document.getElementById("PAD15").innerHTML=bigString[15]; 
> > > } 
> > > 
> > > function setPads(){ 
> > > console.log("setPads()"); 
> > > iframe.document.getElementById("dPad0").selectedIndex = "23";//BASS 
> > > iframe.document.getElementById("dPad1").selectedIndex = "26";//SNARE 
> > > iframe.document.getElementById("dPad2").selectedIndex = "25";//RIMSHOT 
> > > iframe.document.getElementById("dPad3").selectedIndex = "28";//SNARE 2 
> > > iframe.document.getElementById("dPad4").selectedIndex = "29";//TOM1 
> > > iframe.document.getElementById("dPad5").selectedIndex = "30";//TOM2 
> > > iframe.document.getElementById("dPad6").selectedIndex = "32";//TOM3 
> > > iframe.document.getElementById("dPad7").selectedIndex = "27";//HANDCLAP 
> > > iframe.document.getElementById("dPad8").selectedIndex = "36";//TAMBURINE 
> > > iframe.document.getElementById("dPad9").selectedIndex = "38";//COWBELL 
> > > iframe.document.getElementById("dPad10").selectedIndex = "57";//TIMBALES 
> > > iframe.document.getElementById("dPad11").selectedIndex = "45";//MARIMBA 
> > > } 
> > > 
> > > function newDrumVol(){ 
> > > console.log("newDrumVol()"); 
> > > volumeDR[0]=+iframe.document.getElementById("vol0").value; 
> > > volumeDR[1]=+iframe.document.getElementById("vol1").value; 
> > > volumeDR[2]=+iframe.document.getElementById("vol2").value; 
> > > volumeDR[3]=+iframe.document.getElementById("vol3").value; 
> > > volumeDR[4]=+iframe.document.getElementById("vol4").value; 
> > > volumeDR[5]=+iframe.document.getElementById("vol5").value; 
> > > volumeDR[6]=+iframe.document.getElementById("vol6").value; 
> > > volumeDR[7]=+iframe.document.getElementById("vol7").value; 
> > > volumeDR[8]=+iframe.document.getElementById("vol8").value; 
> > > volumeDR[9]=+iframe.document.getElementById("vol9").value; 
> > > volumeDR[10]=+iframe.document.getElementById("volA").value; 
> > > volumeDR[11]=+iframe.document.getElementById("volB").value; 
> > > volumeDR[12]=+iframe.document.getElementById("volC").value; 
> > > volumeDR[13]=+iframe.document.getElementById("volD").value; 
> > > volumeDR[14]=+iframe.document.getElementById("volE").value; 
> > > volumeDR[15]=+iframe.document.getElementById("volF").value; 
> > > } 
> > > 
> > > function selDrum(){ 
> > > console.log("selDrum()"); 
> > > DRUM0=iframe.document.getElementById('dPad0').value; 
> > > DRUM1=iframe.document.getElementById('dPad1').value; 
> > > DRUM2=iframe.document.getElementById('dPad2').value; 
> > > DRUM3=iframe.document.getElementById('dPad3').value; 
> > > DRUM4=iframe.document.getElementById('dPad4').value; 
> > > DRUM5=iframe.document.getElementById('dPad5').value; 
> > > DRUM6=iframe.document.getElementById('dPad6').value; 
> > > DRUM7=iframe.document.getElementById('dPad7').value; 
> > > DRUM8=iframe.document.getElementById('dPad8').value; 
> > > DRUM9=iframe.document.getElementById('dPad9').value; 
> > > DRUM10=iframe.document.getElementById('dPad10').value; 
> > > DRUM11=iframe.document.getElementById('dPad11').value; 
> > > DRUM12=iframe.document.getElementById('dPad12').value; 
> > > DRUM13=iframe.document.getElementById('dPad13').value; 
> > > DRUM14=iframe.document.getElementById('dPad14').value; 
> > > DRUM15=iframe.document.getElementById('dPad15').value; 
> > > } 
> > > 
> > > function drumStop(X){ 
> > > console.log("drumStop()"); 
> > > if (X==48){X=DRUM0;stopNote(X);} 
> > > else if (X==49){X=DRUM1;stopNote(X);} 
> > > else if (X==50){X=DRUM2;stopNote(X);} 
> > > else if (X==51){X=DRUM3;stopNote(X);} 
> > > else if (X==52){X=DRUM4;stopNote(X);} 
> > > else if (X==53){X=DRUM5;stopNote(X);} 
> > > else if (X==54){X=DRUM6;stopNote(X);} 
> > > else if (X==55){X=DRUM7;stopNote(X);} 
> > > else if (X==56){X=DRUM8;stopNote(X);} 
> > > else if (X==57){X=DRUM9;stopNote(X);} 
> > > else if (X==65){X=DRUM10;stopNote(X);} 
> > > else if (X==66){X=DRUM11;stopNote(X);} 
> > > else if (X==67){X=DRUM12;stopNote(X);} 
> > > else if (X==68){X=DRUM13;stopNote(X);} 
> > > else if (X==69){X=DRUM14;stopNote(X);} 
> > > else if (X==70){X=DRUM15;stopNote(X);} 
> > > } 
> > > 
> > > function drumNote(X,Y,Z){ 
> > > console.log("drumNote()"); 
> > > if (X==48){X=DRUM0;playNote(X,volumeDR[0],"DR");} 
> > > if (X==49){X=DRUM1;playNote(X,volumeDR[1],"DR");} 
> > > if (X==50){X=DRUM2;playNote(X,volumeDR[2],"DR");} 
> > > if (X==51){X=DRUM3;playNote(X,volumeDR[3],"DR");} 
> > > if (X==52){X=DRUM4;playNote(X,volumeDR[4],"DR");} 
> > > if (X==53){X=DRUM5;playNote(X,volumeDR[5],"DR");} 
> > > if (X==54){X=DRUM6;playNote(X,volumeDR[6],"DR");} 
> > > if (X==55){X=DRUM7;playNote(X,volumeDR[7],"DR");} 
> > > if (X==56){X=DRUM8;playNote(X,volumeDR[8],"DR");} 
> > > if (X==57){X=DRUM9;playNote(X,volumeDR[9],"DR");} 
> > > if (X==65){X=DRUM10;playNote(X,volumeDR[10],"DR");} 
> > > if (X==66){X=DRUM11;playNote(X,volumeDR[11],"DR");} 
> > > if (X==67){X=DRUM12;playNote(X,volumeDR[12],"DR");} 
> > > if (X==68){X=DRUM13;playNote(X,volumeDR[13],"DR");} 
> > > if (X==69){X=DRUM14;playNote(X,volumeDR[14],"DR");} 
> > > if (X==70){X=DRUM15;playNote(X,volumeDR[15],"DR");} 
> > > } 
> > Changed to this just to be sure it is like the elements i refer to do not exist in iframe or the iframe do not exist? 
> > function initDrum(){ 
> > console.log("initDrum()"); 
> > setTimeout(Druminit,5000); 
> > } 
> > 
> > function Druminit(){ 
> > createOptionList(); //Create the HTML strings for option list 
> > writeOptionList(); //Write the HTML strings 
> > setPads(); //SET STANDARD INSTRUMENT IN SELECT 
> > selDrum(); // CONNECT INSTRUMENT TO PAD 
> > newDrumVol(); //INITIATE ALL PAD VOLUMES 
> > }
> I kind of hate this referential garbage, when it is not even necessary, it is basicly same document but you do not want a file that so big you can not possibly overview it. 
> Does it matter the iframe is within div,its a drag and drop div with a button? 
> 
> <div id=drumContainer> 
> <div id="drumHeader">Virtual Drums
> <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe>
> <button onClick="toggleVirtDrum();"><B>X</B></button></div> 
> </div> 
> </div>
The drag and drop

[toc] | [prev] | [next] | [standalone]

#39552

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 03:26 -0800
Message-ID<d77daa7e-c50c-4395-a2eb-b3d9bdc595a3n@googlegroups.com>
In reply to#39546
onsdag 3 mars 2021 kl. 11:44:18 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall: 
> > onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > > I have no problem reach parent scripts from iframe. 
> > > > > I doubt it. At least with the given code. 
> > > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > > 
> > > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > > 
> > > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > > 
> > > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > > 
> > > > > > function writeOptionList(){ 
> > > > > > console.log("writeOptionList()"); 
> > > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > > } 
> > > > > getElementById() is a method of the document object. 
> > > > > Your `iframe` is an element object. 
> > > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > Did not help. 
> > > Found this in W3 school. 
> > > What is contentWindow never heard about it before? 
> > > 
> > > var iframe = document.getElementById("myFrame"); 
> > > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > > elmnt.style.display = "none"; 
> > > 
> > > ? 
> > Maybe it is because the iframe not loaded yet? 
> > I will move the initiaition until the drum window open. 
> > 
> > Uncaught TypeError: Cannot read property 'document' of null 
> > at writeOptionList (VIRTdrum.js:103) 
> > at initDrum (VIRTdrum.js:93) 
> > at toggleVirtDrum.html:197
> No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist? 
> 
> "iframe HTML ending and then script invoked" 
> </BODY></HTML> 
> 
> <script> 
> parent.initDrum(); 
> </script>
Here is the full iframe.

	<HTML><HEAD>
	</HEAD><BODY>
	<table width=100% border=1 bgcolor=white>
	<tr bgcolor=darkblue><td width=17%>
	   <table bgcolor=red width=100% height=100% border=1 onMouseOver="parent.mouseOverDrum()" onMouseOut="parent.mouseOutDrum()">
	   <tr>
		<td  align=middle>
		<input type="range" onChange="parent.newDrumVol()" id="vol0" min="0" max="127" orient="vertical" /> <BR>
		<FONT COLOR=WHITE> VOL</FONT>
		</td> <td align=middle>
		<div id="PAD0"></div>
		<P>
		<button class="drum"  onClick="parent.drumNote(48,64,'DR')" onmouseout="parent.drumStop(48)">
		<h2>0</h2></button><P>
		</td>
		<td bgcolor=#a81064 align=middle>
		<input type="range" onChange="parent.newDrumVol()" id="vol1" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle bgcolor=#a81064>
		 <div id="PAD1"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(49,64,'DR')" onmouseout="parent.drumStop(49)">
									<h2>1</h2></button>
					   </td>
					   <td align=middle>
							<input type="range" onChange="parent.newDrumVol()" id="vol2" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		 <div id="PAD2"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(50,64,'DR')" onmouseout="parent.drumStop(50)">
									<h2>2</h2></button>
						</td>

						<td align=middle bgcolor=#a81064>
							<input type="range" onChange="parent.newDrumVol()" id="vol3" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle bgcolor=#a81064>
			 <div id="PAD3"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(51,64,'DR')" onmouseout="parent.drumStop(51)">
									<h2>3</h2></button>
						</td>
						<td align=middle>
							<input type="range" onChange="parent.newDrumVol()" id="vol4" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		   <div id="PAD4"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(52,64,'DR')" onmouseout="parent.drumStop(52)">
									<h2>4</h2></button>
						</td>
						<td align=middle bgcolor=#a81064>
							<input type="range" id="vol5" onChange="parent.newDrumVol()" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td bgcolor=#a81064 align=middle>
		 <div id="PAD5"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(53,64,'DR')" onmouseout="parent.drumStop(53)">
									<h2>5</h2></button>
						</td>
						<td align=middle>
							<input type="range" onChange="parent.newDrumVol()" id="vol6" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		 <div id="PAD6"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(54,64,'DR')" onmouseout="parent.drumStop(54)">
									<h2>6</h2></button>
						</td>
						<td align=middle bgcolor=#a81064>
							<input type="range" onChange="parent.newDrumVol()" id="vol7" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle bgcolor=#a81064>
		 <div id="PAD7"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(55,64,'DR')" onmouseout="parent.drumStop(55)">
									<h2>7</h2></button>
						</td>

					</tr>
					<tr>
						<td align=middle bgcolor=#a81064>
							<input type="range" onChange="parent.newDrumVol()" id="vol8" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle bgcolor=#a81064>
		 <div id="PAD8"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(56,64,'DR')" onmouseout="parent.drumStop(56)">
									<h2>8</h2></button>
						</td>
						<td align=middle>
							<input type="range" onChange="parent.newDrumVol()" id="vol9" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		   <div id="PAD9"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(57,64,'DR')" onmouseout="parent.drumStop(57)">
									<h2>9</h2></button>
						</td>
						<td align=middle bgcolor=#a81064>
							<input type="range" onChange="parent.newDrumVol()" id="volA" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle bgcolor=#a81064>
			  <div id="PAD10"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(65,64,'DR')" onmouseout="parent.drumStop(65)">
									<h2>A</h2></button>
						</td>
						<td align=middle>
							<input type="range" onChange="parent.newDrumVol()" id="volB" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		 <div id="PAD11"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(66,64,'DR')" onmouseout="parent.drumStop(66)">
									<h2>B</h2></button>
						</td>
						<td align=middle bgcolor=#a81064>
							<input type="range" onChange="parent.newDrumVol()" id="volC" min="0" max="127" orient="vertical" /><BR>
					   <FONT COLOR=WHITE> VOL</FONT>
					   </td>
						<td align=middle bgcolor=#a81064>
		 <div id="PAD12"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(67,64,'DR')" onmouseout="parent.drumStop(67)">
									<h2>C</h2></button>
						</td>
						<td align=middle>
							<input type="range" onChange="parent.newDrumVol()" id="volD" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		 <div id="PAD13"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(68,64,'DR')" onmouseout="parent.drumStop(68)">
									<h2>D</h2></button>
						</td>
						<td align=middle bgcolor=#a81064>
							<input type="range" onChange="parent.newDrumVol()" id="volE" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle bgcolor=#a81064>
		  <div id="PAD14"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(69,64,'DR')" onmouseout="parent.drumStop(69)">
									<h2>E</h2></button>
						</td>
						<td align=middle>
							<input type="range" onChange="parent.newDrumVol()"  id="volF" min="0" max="127" orient="vertical" /><BR>
		<FONT COLOR=WHITE> VOL</FONT>
						</td>
						<td align=middle>
		 <div id="PAD15"></div>

							<P>
								<button class="drum" onClick="parent.drumNote(70,64,'DR')" onmouseout="parent.drumStop(70)">
									<h2>F</h2></button>
					   </td>

					   </tr>
		   </table>

			  </td></tr></table>
	

	</BODY></HTML>
	
	<script>
	parent.initDrum();
	</script>

[toc] | [prev] | [next] | [standalone]

#39553

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 06:15 -0800
Message-ID<4a233a3b-f819-4db1-bc0b-c7cdf98e4044n@googlegroups.com>
In reply to#39552
onsdag 3 mars 2021 kl. 12:26:37 UTC+1 skrev Jonas Thörnvall:
> onsdag 3 mars 2021 kl. 11:44:18 UTC+1 skrev Jonas Thörnvall: 
> > onsdag 3 mars 2021 kl. 11:26:05 UTC+1 skrev Jonas Thörnvall: 
> > > onsdag 3 mars 2021 kl. 11:11:56 UTC+1 skrev Jonas Thörnvall: 
> > > > tisdag 2 mars 2021 kl. 18:05:01 UTC+1 skrev Jonas Thörnvall: 
> > > > > tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ: 
> > > > > > On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > > > > > > I have no problem reach parent scripts from iframe. 
> > > > > > I doubt it. At least with the given code. 
> > > > > > > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > > > > > > 
> > > > > > > "The PAD0-PAD15" is in the iframe. 
> > > > > > > 
> > > > > > > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > > > > > > 
> > > > > > > iframe = document.getElementById("VirtualDrum"); 
> > > > > > > 
> > > > > > > function writeOptionList(){ 
> > > > > > > console.log("writeOptionList()"); 
> > > > > > > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > > > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > > > > > > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > > > > > > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > > > > > > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > > > > > > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > > > > > > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > > > > > > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > > > > > > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > > > > > > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > > > > > > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > > > > > > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > > > > > > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > > > > > > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > > > > > > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > > > > > > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > > > > > > } 
> > > > > > getElementById() is a method of the document object. 
> > > > > > Your `iframe` is an element object. 
> > > > > Well i tried iframe.document.getElementById("PAD0").innerHTML=bigString[0]; 
> > > > > Did not help. 
> > > > Found this in W3 school. 
> > > > What is contentWindow never heard about it before? 
> > > > 
> > > > var iframe = document.getElementById("myFrame"); 
> > > > var elmnt = iframe.contentWindow.document.getElementsByTagName("H1")[0]; 
> > > > elmnt.style.display = "none"; 
> > > > 
> > > > ? 
> > > Maybe it is because the iframe not loaded yet? 
> > > I will move the initiaition until the drum window open. 
> > > 
> > > Uncaught TypeError: Cannot read property 'document' of null 
> > > at writeOptionList (VIRTdrum.js:103) 
> > > at initDrum (VIRTdrum.js:93) 
> > > at toggleVirtDrum.html:197 
> > No, it can't be i do not execute script until iframe loaded, or could it still be that the iframe not exist? 
> > 
> > "iframe HTML ending and then script invoked" 
> > </BODY></HTML> 
> > 
> > <script> 
> > parent.initDrum(); 
> > </script>
> Here is the full iframe. 
> 
> <HTML><HEAD> 
> </HEAD><BODY> 
> <table width=100% border=1 bgcolor=white> 
> <tr bgcolor=darkblue><td width=17%> 
> <table bgcolor=red width=100% height=100% border=1 onMouseOver="parent.mouseOverDrum()" onMouseOut="parent.mouseOutDrum()"> 
> <tr> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="vol0" min="0" max="127" orient="vertical" /> <BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> <td align=middle> 
> <div id="PAD0"></div> 
> <P> 
> <button class="drum" onClick="parent.drumNote(48,64,'DR')" onmouseout="parent.drumStop(48)"> 
> <h2>0</h2></button><P> 
> </td> 
> <td bgcolor=#a81064 align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="vol1" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD1"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(49,64,'DR')" onmouseout="parent.drumStop(49)"> 
> <h2>1</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="vol2" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD2"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(50,64,'DR')" onmouseout="parent.drumStop(50)"> 
> <h2>2</h2></button> 
> </td> 
> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" onChange="parent.newDrumVol()" id="vol3" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD3"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(51,64,'DR')" onmouseout="parent.drumStop(51)"> 
> <h2>3</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="vol4" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD4"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(52,64,'DR')" onmouseout="parent.drumStop(52)"> 
> <h2>4</h2></button> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" id="vol5" onChange="parent.newDrumVol()" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td bgcolor=#a81064 align=middle> 
> <div id="PAD5"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(53,64,'DR')" onmouseout="parent.drumStop(53)"> 
> <h2>5</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="vol6" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD6"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(54,64,'DR')" onmouseout="parent.drumStop(54)"> 
> <h2>6</h2></button> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" onChange="parent.newDrumVol()" id="vol7" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD7"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(55,64,'DR')" onmouseout="parent.drumStop(55)"> 
> <h2>7</h2></button> 
> </td> 
> 
> </tr> 
> <tr> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" onChange="parent.newDrumVol()" id="vol8" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD8"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(56,64,'DR')" onmouseout="parent.drumStop(56)"> 
> <h2>8</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="vol9" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD9"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(57,64,'DR')" onmouseout="parent.drumStop(57)"> 
> <h2>9</h2></button> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" onChange="parent.newDrumVol()" id="volA" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD10"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(65,64,'DR')" onmouseout="parent.drumStop(65)"> 
> <h2>A</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="volB" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD11"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(66,64,'DR')" onmouseout="parent.drumStop(66)"> 
> <h2>B</h2></button> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" onChange="parent.newDrumVol()" id="volC" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD12"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(67,64,'DR')" onmouseout="parent.drumStop(67)"> 
> <h2>C</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="volD" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD13"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(68,64,'DR')" onmouseout="parent.drumStop(68)"> 
> <h2>D</h2></button> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <input type="range" onChange="parent.newDrumVol()" id="volE" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle bgcolor=#a81064> 
> <div id="PAD14"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(69,64,'DR')" onmouseout="parent.drumStop(69)"> 
> <h2>E</h2></button> 
> </td> 
> <td align=middle> 
> <input type="range" onChange="parent.newDrumVol()" id="volF" min="0" max="127" orient="vertical" /><BR> 
> <FONT COLOR=WHITE> VOL</FONT> 
> </td> 
> <td align=middle> 
> <div id="PAD15"></div> 
> 
> <P> 
> <button class="drum" onClick="parent.drumNote(70,64,'DR')" onmouseout="parent.drumStop(70)"> 
> <h2>F</h2></button> 
> </td> 
> 
> </tr> 
> </table> 
> 
> </td></tr></table>
> </BODY></HTML> 
> 
> <script> 
> parent.initDrum(); 
> </script>
If there is no hints i have to move the drum script to iframe, and use parents calls all the way"which works" but i find it quite annoying i would rather like all scripts in main.

[toc] | [prev] | [next] | [standalone]

#39551

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-03-03 03:17 -0800
Message-ID<a3ed5e8e-e659-4efb-882c-bdffa59253a6n@googlegroups.com>
In reply to#39542
tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ:
> On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
> > I have no problem reach parent scripts from iframe.
> I doubt it. At least with the given code.
> > And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
> > 
> > "The PAD0-PAD15" is in the iframe. 
> > 
> > <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
> > 
> > iframe = document.getElementById("VirtualDrum"); 
> > 
> > function writeOptionList(){ 
> > console.log("writeOptionList()"); 
> > iframe.getElementById("PAD0").innerHTML=bigString[0]; 
> > iframe.getElementById("PAD1").innerHTML=bigString[1]; 
> > iframe.getElementById("PAD2").innerHTML=bigString[2]; 
> > iframe.getElementById("PAD3").innerHTML=bigString[3]; 
> > iframe.getElementById("PAD4").innerHTML=bigString[4]; 
> > iframe.getElementById("PAD5").innerHTML=bigString[5]; 
> > iframe.getElementById("PAD6").innerHTML=bigString[6]; 
> > iframe.getElementById("PAD7").innerHTML=bigString[7]; 
> > iframe.getElementById("PAD8").innerHTML=bigString[8]; 
> > iframe.getElementById("PAD9").innerHTML=bigString[9]; 
> > iframe.getElementById("PAD10").innerHTML=bigString[10]; 
> > iframe.getElementById("PAD11").innerHTML=bigString[11]; 
> > iframe.getElementById("PAD12").innerHTML=bigString[12]; 
> > iframe.getElementById("PAD13").innerHTML=bigString[13]; 
> > iframe.getElementById("PAD14").innerHTML=bigString[14]; 
> > iframe.getElementById("PAD15").innerHTML=bigString[15]; 
> > }
> getElementById() is a method of the document object. 
> Your `iframe` is an element object.
parent.xxxxx();
Reach any script within main/parent document.

[toc] | [prev] | [next] | [standalone]

#39569

FromJJ <jj4public@gmail.com>
Date2021-03-04 21:16 +0700
Message-ID<1ellu9h6nkhzc.1xoh3xl0n3y4l$.dlg@40tude.net>
In reply to#39551
On Wed, 3 Mar 2021 03:17:26 -0800 (PST), Jonas Thörnvall wrote:

> tisdag 2 mars 2021 kl. 17:57:21 UTC+1 skrev JJ:
>> On Tue, 2 Mar 2021 04:12:14 -0800 (PST), Jonas Thörnvall wrote: 
>>> I have no problem reach parent scripts from iframe.
>> I doubt it. At least with the given code.
>>> And my scripts are SRCs in main, i want to write text into an iframe from SRC funtions in main. But i fail to write to iframe. 
>>> 
>>> "The PAD0-PAD15" is in the iframe. 
>>> 
>>> <iframe src="/toggleVirtDrum.html" id="VirtualDrum" name="VirtualDrum"></iframe> 
>>> 
>>> iframe = document.getElementById("VirtualDrum"); 
>>> 
>>> function writeOptionList(){ 
>>> console.log("writeOptionList()"); 
>>> iframe.getElementById("PAD0").innerHTML=bigString[0]; 
>>> iframe.getElementById("PAD1").innerHTML=bigString[1]; 
>>> iframe.getElementById("PAD2").innerHTML=bigString[2]; 
>>> iframe.getElementById("PAD3").innerHTML=bigString[3]; 
>>> iframe.getElementById("PAD4").innerHTML=bigString[4]; 
>>> iframe.getElementById("PAD5").innerHTML=bigString[5]; 
>>> iframe.getElementById("PAD6").innerHTML=bigString[6]; 
>>> iframe.getElementById("PAD7").innerHTML=bigString[7]; 
>>> iframe.getElementById("PAD8").innerHTML=bigString[8]; 
>>> iframe.getElementById("PAD9").innerHTML=bigString[9]; 
>>> iframe.getElementById("PAD10").innerHTML=bigString[10]; 
>>> iframe.getElementById("PAD11").innerHTML=bigString[11]; 
>>> iframe.getElementById("PAD12").innerHTML=bigString[12]; 
>>> iframe.getElementById("PAD13").innerHTML=bigString[13]; 
>>> iframe.getElementById("PAD14").innerHTML=bigString[14]; 
>>> iframe.getElementById("PAD15").innerHTML=bigString[15]; 
>>> }
>> getElementById() is a method of the document object. 
>> Your `iframe` is an element object.
> parent.xxxxx();
> Reach any script within main/parent document.

No such code in your initial post.

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web