javascript works in IE but not working in firefox

•

What is DaniWeb IT Discussion Community?

You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 456,418 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,597 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.

Join our community!

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

Thread Tools Display Modes

Views: 5351 | Replies: 1

•

Join Date: Jan 2007

Posts: 5

Reputation: sendkamal is an unknown quantity at this point

Rep Power: 0

Solved Threads: 0

sendkamal

Offline

Newbie Poster

javascript works in IE but not working in firefox

Jan 31st, 2007

Hello all,
I am new to javascript and cross-browsing. I have a XSLT generated HTML document which works fine ini IE and opera but have problems with firefox. I tried to debug with firebug but i have no idea what should i do next to fix the problem. I would greatly appreciate if anybody help me figuring this out. Here is my html document:

<html xmlns

leepXML="http://www.SleepXML.org">
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>SleepXML.com</title>
<STYLE type="text/css">
.infotable
{
font: Icon;
border: 1px Solid ThreeDShadow;
background: Window;
color: WindowText;
MARGIN-LEFT: 10px;
}
.issuetable
{
font: Icon;
border: none;
MARGIN-LEFT: 10px;
}
.records
{
color:gray;
}
b.entities
{
margin-left:10px;
text-align:right;
color:blue;
font-weight:normal;
}
.issuetitle
{
background: ButtonFace
border: 1px Solid ThreeDShadow;
cursor: default;
}
.header
{
background: ButtonFace
cursor: default;

}
.content
{
padding: 2px 5px;
}
.expandable
{
CURSOR: hand;
}
.collapsed
{
DISPLAY: none;
}
H2 {
color: black;
font-size: 12pt;
font-weight:bold;
cursor: default;
}
small
{
color:red;
}
.divstyle {
padding: 10px 10px 10px 10px;
border: 1px Solid ThreeDShadow
border-color: ButtonHighlight ButtonShadow
ButtonShadow ButtonHighlight;
margin: 2px auto 1px auto;
}
CAPTION.MYTABLE {

}
TABLE.MYTABLE {
Font: Icon;
border: 1px Solid ThreeDShadow;
background: Window;
color: WindowText;
width: 90%
}
TH.MYTABLE {
background: ButtonFace
cursor: default;
}

TR.MYTABLE {

}
TD.MYTABLE {
padding: 2px 5px;
}
.tabset_tabs {
margin:0px;
padding:0px;
list-style-type:none;
position:relative;
z-index:2;
white-space:wrap;
}
.tabset_tabs li {
margin:0px;
padding:0px;
display:inline;
}
.tabset_tabs a {
color:black;
background-color:ButtonFace ! important;
border-color: ButtonShadow ButtonHighlight
ButtonHighlight ButtonShadow;
text-decoration:none;
padding:0em 0.6em;
}
.tabset_tabs a:hover {
color:black! important;
background-color:white ! important;
}
.tabset_tabs a.active {
color:black ! important;
background-color:white ! important;
border-color: ButtonShadow ButtonHighlight
ButtonHighlight ButtonShadow;
border-left-width:1px;
cursor:default;
padding-top:1px;
padding-bottom:1px;
}
.tabset_tabs li.firstchild a {
border-left-width:1px ;
}
.tabset_content {
background: #f4f4f4;
z-index:2;
padding:0.5em 1em;
display:none;
}
.tabset_label { display:none; }
.tabset_content_active { display:block; }
@media aural{
.tabset_content,
.tabset_label { display:block; }
}
</STYLE>
<script language="javascript" type="text/javascript">
//***collapsible rows
function outliner() {
oMe = window.event.srcElement;
//get child element
var child = document.all[event.srcElement.getAttribute("child",false)];
//if child element exists, expand or collapse it.
if (null != child)
child.className = child.className == "collapsed" ? "expanded" : "collapsed";
}
function changepic() {
uMe = window.event.srcElement;
var check = uMe.src.toLowerCase();
if (check.lastIndexOf("expand.gif") != -1)
{
uMe.src = "collapse.gif";
}
else
{
uMe.src = "expand.gif";
}
}

//*** addclasskillclass.js
//*** This code is copyright 2002-2004 by Gavin Kistner and Refinery; www.refinery.com
//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
//*** Reuse or modification is free provided you abide by the terms of that license.
//*** (Including the first two lines above in your source code satisfies the conditions.)
//***Adds a new class to an object, preserving existing classes
function AddClass(obj,cName){ KillClass(obj,cName); return obj && (obj.className+=(obj.className.length>0?' ':'')+cName); }
//***Removes a particular class from an object, preserving other existing classes.
function KillClass(obj,cName){ return obj && (obj.className=obj.className.replace(new RegExp("^"+cName+"\\b\\s*|\\s*\\b"+cName+"\\b",'g'),'')); }
//***Returns true if the object has the class assigned, false otherwise.
function HasClass(obj,cName){ return (!obj || !obj.className)?false

new RegExp("\\b"+cName+"\\b")).test(obj.className) }
//*** attachment.js
//***Cross browser attach event function. For 'evt' pass a string value with the leading "on" omitted
//***e.g. AttachEvent(window,'load',MyFunctionNameWithoutParenthesis,false);
function AttachEvent(obj,evt,fnc,useCapture){
if (!useCapture) useCapture=false;
if (obj.addEventListener){
obj.addEventListener(evt,fnc,useCapture);
return true;
} else if (obj.attachEvent) return obj.attachEvent("on"+evt,fnc);
else{
MyAttachEvent(obj,evt,fnc);
obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
}
}
//The following are for browsers like NS4 or IE5Mac which don't support either
//attachEvent or addEventListener
function MyAttachEvent(obj,evt,fnc){
if (!obj.myEvents) obj.myEvents={};
if (!obj.myEvents[evt]) obj.myEvents[evt]=[];
var evts = obj.myEvents[evt];
evts[evts.length]=fnc;
}
function MyFireEvent(obj,evt){
if (!obj || !obj.myEvents || !obj.myEvents[evt]) return;
var evts = obj.myEvents[evt];
for (var i=0,len=evts.length;i<len;i++) evts[i]();
}
//*** addcss.js
// Add a new stylesheet to the document;
// url [optional] A url to an external stylesheet to use
// idx [optional] The index in document.styleSheets to insert the new sheet before
function AddStyleSheet(url,idx){
var css,before=null,head=document.getElementsByTagName("head")[0];
if (document.createElement){
if (url){
css = document.createElement('link');
css.rel = 'stylesheet';
css.href = url;
} else css = document.createElement('style');
css.media = 'all';
css.type = 'text/css';
if (idx>=0){
for (var i=0,ct=0,len=head.childNodes.length;i<len;i++){
var el = head.childNodes[i];
if (!el.tagName) continue;
var tagName = el.tagName.toLowerCase();
if (ct==idx){
before = el;
break;
}
if (tagName=='style' || tagName=='link' && (el.rel && el.rel.toLowerCase()=='stylesheet' || el.type && el.type.toLowerCase()=='text/css') ) ct++;
}
}
head.insertBefore(css,before);
return document.styleSheets[before?idx:document.styleSheets.length-1];
} else return alert("I can't create a new stylesheet for you. Sorry.");
}
// e.g. var newBlankSheetAfterAllOthers = AddStyleSheet();
// e.g. var newBlankSheetBeforeAllOthers = AddStyleSheet(null,0);
// e.g. var externalSheetAfterOthers = AddStyleSheet('http://phrogz.net/JS/Classes/docs.css');
// e.g. var externalSheetBeforeOthers = AddStyleSheet('http://phrogz.net/JS/Classes/docs.css',0);

// Cross-browser method for inserting a new rule into an existing stylesheet.
// ss - The stylesheet to stick the new rule in
// selector - The string value to use for the rule selector
// styles - The string styles to use with the rule
function AddRule(ss,selector,styles){
if (!ss) return false;
if (ss.insertRule) return ss.insertRule(selector+' {'+styles+'}',ss.cssRules.length);
if (ss.addRule){
ss.addRule(selector,styles);
return true;
}
return false;
}
// e.g. AddRule( document.styleSheets[0] , 'a:link' , 'color:blue; text-decoration:underline' );
// e.g. AddRule( AddStyleSheet() , 'hr' , 'display:none' );
//*** tabtastic.js
//*** Tabtastic -- see http://phrogz.net/JS/Tabstatic/index.html
//*** Version 1.0 20040430 Initial release.
//*** 1.0.2 20040501 IE5Mac, IE6Win compat.
//*** 1.0.3 20040501 Removed IE5Mac/Opera7 compat. (see http://phrogz.net/JS/Tabstatic/index.html#notes)
//*** 1.0.4 20040521 Added scroll-back hack to prevent scrolling down to page anchor. Then commented out

AttachEvent(window,'load',function(){
var tocTag='ul',tocClass='tabset_tabs',tabTag='a',contentClass='tabset_content';
function FindEl(tagName,evt){
if (!evt && window.event) evt=event;
if (!evt) return DebugOut("Can't find an event to handle in DLTabSet:

etTab",0);
var el=evt.currentTarget || evt.srcElement;
while (el && (!el.tagName || el.tagName.toLowerCase()!=tagName)) el=el.parentNode;
return el;
}
function SetTabActive(tab){
if (tab.tabTOC.activeTab){
if (tab.tabTOC.activeTab==tab) return;
KillClass(tab.tabTOC.activeTab,'active');
if (tab.tabTOC.activeTab.tabContent) KillClass(tab.tabTOC.activeTab.tabContent,'tabset_content_active');
//if (tab.tabTOC.activeTab.tabContent) tab.tabTOC.activeTab.tabContent.style.display='';
if (tab.tabTOC.activeTab.prevTab) KillClass(tab.tabTOC.activeTab.previousTab,'preActive');
if (tab.tabTOC.activeTab.nextTab) KillClass(tab.tabTOC.activeTab.nextTab,'postActive');
}
AddClass(tab.tabTOC.activeTab=tab,'active');
if (tab.tabContent) AddClass(tab.tabContent,'tabset_content_active');
//if (tab.tabContent) tab.tabContent.style.display='block';
if (tab.prevTab) AddClass(tab.prevTab,'preActive');
if (tab.nextTab) AddClass(tab.nextTab,'postActive');
}
function SetTabFromAnchor(evt){
setTimeout('document.body.scrollTop='+document.body.scrollTop,1);
SetTabActive(FindEl('a',evt).semanticTab);
}
function Init(){
window.everyTabThereIsById = {};

var anchorMatch = /#([a-z][\w.:-]*)$/i,match;
var activeTabs = [];

var tocs = document.getElementsByTagName(tocTag);
for (var i=0,len=tocs.length;i<len;i++){
var toc = tocs[i];
if (!HasClass(toc,tocClass)) continue;
var lastTab;
var tabs = toc.getElementsByTagName(tabTag);
for (var j=0,len2=tabs.length;j<len2;j++){
var tab = tabs[j];
if (!tab.href || !(match=anchorMatch.exec(tab.href))) continue;
if (lastTab){
tab.prevTab=lastTab;
lastTab.nextTab=tab;
}
tab.tabTOC=toc;
everyTabThereIsById[tab.tabID=match[1]]=tab;
tab.tabContent = document.getElementById(tab.tabID);

if (HasClass(tab,'active')) activeTabs[activeTabs.length]=tab;

lastTab=tab;
}
AddClass(toc.getElementsByTagName('li')[0],'firstchild');
}
for (var i=0,len=activeTabs.length;i<len;i++){
SetTabActive(activeTabs[i]);
}
for (var i=0,len=document.links.length;i<len;i++){
var a = document.links[i];
if (!(match=anchorMatch.exec(a.href))) continue;
if (a.semanticTab = everyTabThereIsById[match[1]]) AttachEvent(a,'click',SetTabFromAnchor,false);
}

if ((match=anchorMatch.exec(location.href)) && (a=everyTabThereIsById[match[1]])) SetTabActive(a);

//Comment out the next line and include the file directly if you need IE5Mac or Opera7 support.
//AddStyleSheet('tabtastic.css',0);
}
Init();
},false);

//***collapsible rows
function outliner() {
oMe = window.event.srcElement;
//get child element
var child = document.all[event.srcElement.getAttribute("child",false)];
//if child element exists, expand or collapse it.
if (null != child)
child.className = child.className == "collapsed" ? "expanded" : "collapsed";
}
function changepic() {
uMe = window.event.srcElement;
var check = uMe.src.toLowerCase();
if (check.lastIndexOf("expand.gif") != -1)
{
uMe.src = "collapse.gif";
}
else
{
uMe.src = "expand.gif";
}
}
//*** SORTABLE ROWS
var ts_version = "1.26";
var ts_browser_agt = navigator.userAgent.toLowerCase();
var ts_browser_is_ie = ((ts_browser_agt.indexOf("msie") != -1) && (ts_browser_agt.indexOf("opera") == -1));
var ml_tsort = {
///////////////////////////////////////////////////
// configurable constants, modify as needed!
sort_col_title : "Click to Sort!", // the popup text for the sorting link in the header columns
sort_col_asc_title : "Sorted ascending", // the popup text for the sorting link in the header column after the column's sorted in ascending order
sort_col_desc_title : "Sorted Descending ", // the popup text for the sorting link in the header column after the column's sorted in ascending order
sort_col_class : "abc", // whichever class you want the heading to be
sort_col_style : "text-decoration:none; font-weight:bold; color:black", // whichever style you want the link to look like
sort_col_class_post_sort : "def", // whichever class you want the heading for the column that's just sorted
sort_col_style_post_sort : "text-decoration:none; font-weight:bold; color:black", // whichever style you want the link to look like when the column for the link was sorted
sort_col_mouseover : "this.style.color='blue'", // what style the link should use onmouseover?
use_ctrl_alt_click : false, // allow ctrl-alt-click anywhere in table to activate sorting?
sort_only_sortable : true, // make all tables sortable by default or just make the tables with "sortable" class sortable?

//////////////////////////////////////////////////
// speed related constants, modify as needed!
table_content_might_change : false, // table content could be changed by other JS on-the-fly? if so, some speed improvements cannot be used.
preserve_style : " ", // (row, cell) preserves style for row or cell e.g., row is useful when the table highlights rows alternatively. cell is much slower while no preservation's the fastest by far!
tell_me_time_consumption : false, // give stats about time consumed during sorting and table update/redrawing.

//////////////////////////////////////////////////////////
// anything below this line, modify at your own risk!

smallest_int : -2147483648000, // date parse is in milliseconds, hence the 000
set_vars : function(event)
{
var e = (event)? event : window.event;
var element = (event)? ((event.target)? event.target : event.srcElement) : window.event.srcElement;
var clicked_td = ml_tsort.getParent(element,'TD') || ml_tsort.getParent(element,'TH');
var table = ml_tsort.getParent(element,'TABLE');
if(!table || table.rows.length < 1 || !clicked_td) return;
var column = clicked_td.cellIndex;
if (e.altKey && e.ctrlKey && ml_tsort.use_ctrl_alt_click) ml_tsort.resortTable(table.rows[0].cells[column]);
},
makeSortable: function(table)
{
if (table.rows && table.rows.length > 0) {
var rowidx = table.getAttribute("ts_linkrow") || 0;
var firstRow = table.rows[rowidx];
}
if (!firstRow) return;
var sortCell;
// We have a first row: assume it's the header (it works for <thead> too),
// and make its contents clickable links
for (var i=0;i<firstRow.cells.length;i++) {
var cell = firstRow.cells[i];
if(cell.getAttribute("ts_nosort")) continue;
var txt = cell.innerHTML;
if(cell.getAttribute("sortdir")) sortCell = cell;
cell.innerHTML = '<a style="'+this.sort_col_style+'" onMouseOver="this.oldstyle=this.style.cssText;'+this.sort_col_mouseover+'" onMouseOut="this.style.cssText=this.oldstyle;" class="'+this.sort_col_class+'" href="#" title="'+this.sort_col_title+'" onclick="javascript:ml_tsort.resortTable(this.parentNode);return false">'+txt+'</a>';
}
if(sortCell) this.resortTable(sortCell);
},

sortables_init : function()
{
// Find all tables with class sortable and make them sortable
if (!document.getElementsByTagName) return;
var tbls = document.getElementsByTagName("table");
for (var ti=0;ti<tbls.length;ti++) {
thisTbl = tbls[ti];
if(!ml_tsort.sort_only_sortable || thisTbl.className.match(/sortable/i))
ml_tsort.makeSortable(thisTbl);
}
},

getParent : function(el, pTagName)
{
if (el == null) return null;
else if (el.nodeType == 1 && el.tagName.toLowerCase() == pTagName.toLowerCase()) // Gecko bug, supposed to be uppercase
return el;
else
return this.getParent(el.parentNode, pTagName);
},

getInnerText : function(el)
{
if (typeof el == "string") return el;
if (typeof el == "undefined") { return el };
if (el.innerText) return el.innerText; //Not needed but it is faster
var str = "";

var cs = el.childNodes;
var l = cs.length;
for (var i = 0; i < l; i++) {
switch (cs[i].nodeType) {
case 1: //ELEMENT_NODE
str += this.getInnerText(cs[i]);
break;
case 3: //TEXT_NODE
str += cs[i].nodeValue;
break;
}
}
return str;
},

match_date_format : function(value, format)
{
var v = this.getInnerText(value.cells[this.sort_column_index]);
this.set_date_array(format);
if(format == 'M/D/Y' && !isNaN(Date.parse(v)))
return true;
else if(!isNaN(this.convert_date(v))) return true;
this.set_date_array(format.replace(/\//g, '-'));
if(!isNaN(this.convert_date(v))) return true;
this.set_date_array(format.replace(/\//g, '.'));
if(!isNaN(this.convert_date(v))) return true;
this.set_date_array(format.replace(/\//g, ' '));
if(!isNaN(this.convert_date(v))) return true;
return false;
},

resortTable : function(td)
{
if(td == null) return;
var column = td.cellIndex;
var table = this.getParent(td,'TABLE');
this.sort_column_index = column;
if(table == null || table.rows.length <= 2) return;
// now let's do a lot just to save a little time, if possible at all.

DaniWeb Home > Forums > Web Development > JavaScript / DHTML / AJAX

javascript works in IE but not working in firefox

javascript works in IE but not working in firefox