I am having a problem with Internet Explorer and javascript on a WYSIWYG
editor I am creating. It all works in Mozilla, but IE returns flase for
queryCommandEna bled('forecol') . JS isn't my strong suit, so I am turning
to all you experts for help. What am I missing here? Other commands like
formatblock, fontsize and fontname all work fine, so I assume that it
has something to do with not getting the correct selection because of
the iframe. Any help is greatly appreciated.
In an HTML document I have the following line:
<img src="images/forecol.png" onClick="DoText Format('forecol or','')"
id="forecolor" >
<iframe width="175" height="125" id="forecolor0 " src="palette.ht ml"
style="visibili ty: hidden; position: absolute; left: 0px; top:
0px;"></iframe>
palette.html is like this:
<html>
<head>
<title>Color Palete</title>
<script language="JavaS cript" type="text/javascript">
<!--
function selectColor(col or){
self.parent.set Color(color);
}
function InitColorPalett e(){
if (document.getEl ementsByTagName )
var x = document.getEle mentsByTagName( 'TD');
else if (document.all)
var x = document.all.ta gs('TD');
for (var i=0;i<x.length; i++){
x[i].onclick = click;
}
}
function click(){
str=this.id;
color=str.repla ce('c','#');
selectColor(col or);
}
-->
</script>
<style type="text/css">
<!--
html,body{margi n: 0px; padding: 0px;}
td{border: black none 2px;}
td:hover{border : white solid 2px;}
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body bgcolor="white" onLoad="InitCol orPalette()">
<table border="0" cellpadding="0" cellspacing="2" >
<tr>
<td id="cFFFFFF" bgcolor="#FFFFF F" width="15" height="15">&nb sp;</td>
<td id="cFFCCCC" bgcolor="#FFCCC C" width="15" height="15">&nb sp;</td>
....
In the included javascript source file I have the following functions:
function DoTextFormat(co mmand, option){
if((command=='f orecolor') || (command=='hili tecolor')){
parent.command= command;
layerid=command +'0';
buttonElement=d ocument.getElem entById(command );
document.getEle mentById(layeri d).style.left=g etOffsetLeft(bu ttonElement)
+ 'px';
document.getEle mentById(layeri d).style.top=(g etOffsetTop(but tonElement)
+ buttonElement.o ffsetHeight) + 'px';
if(document.get ElementById(lay erid).style.vis ibility=='hidde n')
document.getEle mentById(layeri d).style.visibi lity='visible';
else{
document.getEle mentById(layeri d).style.visibi lity='hidden';
}
//get current selected range
var
sel=document.ge tElementById('i View').contentW indow.document. selection;
if(sel!=null){
rng=sel.createR ange();
}
}else{
if(document.get ElementById('iV iew').contentWi ndow.document.q ueryCommandEnab led(command)){
document.getEle mentById('iView ').contentWindo w.document.exec Command(command ,
false, option);
return true;
}else return false;
}
document.getEle mentById('iView ').contentWindo w.focus();
}
function setColor(color) {
elem=command+'0 ';
if(browser.isIE 5up){
//retrieve selected range
var
sel=document.ge tElementById('i View').contentW indow.document. selection;
if(sel!=null){
var newselectionRan ge=sel.createRa nge();
newselectionRan ge.select();
}
}else{
document.getEle mentById('iView ').contentWindo w.focus();
}
if(document.get ElementById('iV iew').contentWi ndow.document.q ueryCommandEnab led(command)){
document.getEle mentById('iView ').contentWindo w.document.exec Command(command ,
false, color);
}else{
alert("queryCom mandEnabled("+c ommand+") returned false. Cannot set color
to "+color);
// close palette before exiting function
document.getEle mentById(elem). style.visibilit y='hidden';
return false;
}
document.getEle mentById('iView ').contentWindo w.focus();
document.getEle mentById(elem). style.visibilit y='hidden';
return true;
}
TIA
--
Justin Koivisto - spam@koivi.com
PHP POSTERS: Please use comp.lang.php for PHP related questions,
alt.php* groups are not recommended.
editor I am creating. It all works in Mozilla, but IE returns flase for
queryCommandEna bled('forecol') . JS isn't my strong suit, so I am turning
to all you experts for help. What am I missing here? Other commands like
formatblock, fontsize and fontname all work fine, so I assume that it
has something to do with not getting the correct selection because of
the iframe. Any help is greatly appreciated.
In an HTML document I have the following line:
<img src="images/forecol.png" onClick="DoText Format('forecol or','')"
id="forecolor" >
<iframe width="175" height="125" id="forecolor0 " src="palette.ht ml"
style="visibili ty: hidden; position: absolute; left: 0px; top:
0px;"></iframe>
palette.html is like this:
<html>
<head>
<title>Color Palete</title>
<script language="JavaS cript" type="text/javascript">
<!--
function selectColor(col or){
self.parent.set Color(color);
}
function InitColorPalett e(){
if (document.getEl ementsByTagName )
var x = document.getEle mentsByTagName( 'TD');
else if (document.all)
var x = document.all.ta gs('TD');
for (var i=0;i<x.length; i++){
x[i].onclick = click;
}
}
function click(){
str=this.id;
color=str.repla ce('c','#');
selectColor(col or);
}
-->
</script>
<style type="text/css">
<!--
html,body{margi n: 0px; padding: 0px;}
td{border: black none 2px;}
td:hover{border : white solid 2px;}
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body bgcolor="white" onLoad="InitCol orPalette()">
<table border="0" cellpadding="0" cellspacing="2" >
<tr>
<td id="cFFFFFF" bgcolor="#FFFFF F" width="15" height="15">&nb sp;</td>
<td id="cFFCCCC" bgcolor="#FFCCC C" width="15" height="15">&nb sp;</td>
....
In the included javascript source file I have the following functions:
function DoTextFormat(co mmand, option){
if((command=='f orecolor') || (command=='hili tecolor')){
parent.command= command;
layerid=command +'0';
buttonElement=d ocument.getElem entById(command );
document.getEle mentById(layeri d).style.left=g etOffsetLeft(bu ttonElement)
+ 'px';
document.getEle mentById(layeri d).style.top=(g etOffsetTop(but tonElement)
+ buttonElement.o ffsetHeight) + 'px';
if(document.get ElementById(lay erid).style.vis ibility=='hidde n')
document.getEle mentById(layeri d).style.visibi lity='visible';
else{
document.getEle mentById(layeri d).style.visibi lity='hidden';
}
//get current selected range
var
sel=document.ge tElementById('i View').contentW indow.document. selection;
if(sel!=null){
rng=sel.createR ange();
}
}else{
if(document.get ElementById('iV iew').contentWi ndow.document.q ueryCommandEnab led(command)){
document.getEle mentById('iView ').contentWindo w.document.exec Command(command ,
false, option);
return true;
}else return false;
}
document.getEle mentById('iView ').contentWindo w.focus();
}
function setColor(color) {
elem=command+'0 ';
if(browser.isIE 5up){
//retrieve selected range
var
sel=document.ge tElementById('i View').contentW indow.document. selection;
if(sel!=null){
var newselectionRan ge=sel.createRa nge();
newselectionRan ge.select();
}
}else{
document.getEle mentById('iView ').contentWindo w.focus();
}
if(document.get ElementById('iV iew').contentWi ndow.document.q ueryCommandEnab led(command)){
document.getEle mentById('iView ').contentWindo w.document.exec Command(command ,
false, color);
}else{
alert("queryCom mandEnabled("+c ommand+") returned false. Cannot set color
to "+color);
// close palette before exiting function
document.getEle mentById(elem). style.visibilit y='hidden';
return false;
}
document.getEle mentById('iView ').contentWindo w.focus();
document.getEle mentById(elem). style.visibilit y='hidden';
return true;
}
TIA
--
Justin Koivisto - spam@koivi.com
PHP POSTERS: Please use comp.lang.php for PHP related questions,
alt.php* groups are not recommended.
Comment