removeAllRanges function not working in Firefox

[mindSmile]

Hey there, I'm trying to get this script working and having a problem with it in firefox. Essentially, I want to select a bit of text, and as soon as I release the mouse on the selection, I want that selected text to be passed in to my XMLhttprequest (which is happening perfectly) and for the text to become deselected. This is working fine in Chrome and Safari, but not in Firefox. Firebug is telling me "document.getSelection().removeAllRanges is not a function"

The removeAllRanges is part of the emptySelection() function. Sorry for including so much code. I'm not well-seasoned in javascript and I really don't know which part may be the culprit.

Does anyone know why firefox isn't recognizing removeAllRanges as a function or how I can get around it to make the deselection happen right away?



var text = "";
var time_variable;
function getXMLObject(){
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e2) {
xmlHttp = false;
}
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined'){
xmlHttp = new XMLHttpRequest();
}
return xmlHttp;
}
var xmlhttp = new getXMLObject();
function handleServerResponse() {
if (xmlhttp.readyState == 4) {
if(xmlhttp.status == 200) {
document.getElementById("st_translatebox").innerHTML=xmlhttp.responseText+"&nbsp;<a href=\"\" id=\"close\">X</a>";
document.getElementById("close").onclick = st_hideTranslateBox;
}
}
}
function ajaxPost(){
var getdate = new Date();
if(xmlhttp) {
xmlhttp.open("POST","translate.php",true);
xmlhttp.onreadystatechange = handleServerResponse;
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send();
}
}
function getCookie(c_name){
if(document.cookie.length>0){
c_start=document.cookie.indexOf(c_name + "=");
if (c_start!=-1){
c_start=c_start + c_name.length+1;
c_end=document.cookie.indexOf(";",c_start);
if(c_end==-1) c_end=document.cookie.length;
return unescape(document.cookie.substring(c_start,c_end));
}
}
return "";
}
function setCookie(c_name,value,expiredays){
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie=c_name+ "=" +encodeURI(value)+((expiredays==null) ? "" : "; expires="+exdate.toGMTString());
}
function st_initCapture(){
var IE = /*@cc_on!@*/false;
if(!IE){
window.captureEvents(Event.CLICK);
document.onmouseup = captureTranslate;
}
else{
document.onmouseup = captureTranslate;
}
}
function getSelection() {
if(document.getSelection){
return document.getSelection();
}
else if(document.selection){
return document.selection.createRange().text;
}
else{
return window.getSelection();
}
}
function emptySelection() {
if(document.getSelection){
return document.getSelection().removeAllRanges();
}
else if(document.selection){
return document.selection.blur();
}
else{
return window.getSelection().removeAllRanges();
}
}
function openTranslate(e){
var st_translatebox = document.getElementById("st_translatebox");
if(st_translatebox){
document.body.removeChild(st_translatebox);
}
var element = document.createElement("div");
var IE = /*@cc_on!@*/false;
if(IE){
var posx = event.x;
var posy = event.y;
}
else{
var posx = e.pageX;
var posy = e.pageY;
}
element.style.position = "absolute";
element.style.left = posx+"px";
element.style.top = posy+6+"px";
element.setAttribute("id","st_translatebox");
document.body.appendChild(element);
if (document.getElementById("close")){document.getElementById("close").onclick = st_hideTranslateBox;}

}
function captureTranslate(e){
text = getSelection();
if(getSelection() != "" && getSelection() != null){
setCookie("st_query",text,1);
ajaxPost();
openTranslate(e);
emptySelection();
}
}

st_initCapture();


Thanks!

[Kor]

try a referential disjunction:

var selection = window.getSelection();
selection.removeAllRanges();

But your code seems wrong to me. I would have used something like:

...
if (window.getSelection) { // Firefox, Opera, Safari
var selectionRange = window.getSelection();
alert ("The text content of the selection:\n" + selectionRange.toString());
}
else {
if (document.selection.type == 'None') {
alert ("No content is selected, or the selected content is not available!");
}
else {
var textRange = document.selection.createRange );
alert ("The text content of the selection:\n" + textRange.text);
}
}
...

and

...
if (window.getSelection) { // Firefox, Opera, Safari
var selection = window.getSelection();
selection.removeAllRanges();
}
else {
if (document.selection.createRange) { // Internet Explorer
var range = document.selection.createRange();
document.selection.empty();
}
}
...

And I don't understand why to you need to return the methods inside thu functions

[mindSmile]

Thanks for your reply!

This is some code I had purchased from a developer, who, unfortunately is too busy to help me with this little problem. I don't know why the developer was having the functions return, so I replaced their code for emptySelection() with your code.

Now everything continues to work beautifully in Safari and Chrome, but Firefox still isn't deselecting the text. On the bright side, Firebug is no longer complaining about the removeAllRanges function!

Essentially, this code brings up a tooltip-like box when a user highlights a bit of text. The tooltip has an X the user can click to close it, but, in Firefox, because the selection is still highlighted, clicking the X seems to re-submit the highlighted text through the whole process and another tooltip appears (though the first one closes correctly). In the other browsers, the highlighted text deselects as soon as the selection is made, so another click doesn't "resubmit" the way it does in Firefox. Oy, it's so nuanced!

I don't know if I've explained it well, but I hope you get an idea of what the problem is. Thanks for your time!

[Kor]

It might be a FF bug. See a possible workaround at:
http://stackoverflow.com/questions/214722/firefox-3-03-and-contenteditable

[mindSmile]

Hmm...

Haven't been able to fix it yet, and though I read through the link you provided, I'm not sure how to implement that to help with the problem.

I also found today that the text isn't becoming deselected in Opera either. Firebug still doesn't think removeAllRanges() is a function that can be used on window.getSelection(), though most sources I see online show that this is exactly how to use it!

Any other ideas?