JavaScript - How To Get Document Property Values In Firefox?

My web pages are built with JSP + javascript + AJAX, so a little dynamic when loading a page (it is NOT a static HTML text page).

As a common practice, when users visits my website, they can click on a hyperlink to open another webpage. When they want to go back, they can click the browser's BACK button that will bring them back to where they were.

What happened to the firefox is that when its default CACHE runs out, it will display:

Document Expired
This document is no longer available.
The requested document is not available in Firefox'x cache.
...
[Try Again]


The general solution is that I can go to the Options page to either increase the CACHE limit ot clean up the CACHE.

But for a public user, they either do not know what to do or assume that my website has problem!


Please offer some suggestion to solve this problem such that regardless the caching, the browser's BACK button (or script window.history.back() will always bring it back to the previous page.



Thanks

Scott

P.S. I have tried:
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> -->
<!-- <meta http-equiv="Pragma" content="no-cache" /> -->
<!-- <meta http-equiv="Expires" content="0" /> -->

I'm working on my own site for layouts for sites like Myspace and Ning.
Myspace changed their layouts to no longer include CSS so I am working on a new way to post their layouts.

I used this same method to post all our other layouts.
For some reason this is not showing up in IE.

Firefox:


IE:


Interestingly enough, when I run the debugger in IE it loads when it is done.
If not I get the black hole effect above.

ERRORS:
Object required
Not implemented

Any help will be greatly appreciated!

Code:

bgImg = document.getElementById('bg').innerHTML;
tile = document.getElementById('bgtile').innerHTML;
att = document.getElementById('bgatt').innerHTML;
pos = document.getElementById('bgpos').innerHTML;
top = document.getElementById('mar').innerHTML;
ht = document.getElementById('marht').innerHTML;
alink = document.getElementById('sel').innerHTML;
col = document.getElementById('bgcol').innerHTML;
hed = document.getElementById('hdr').innerHTML;
bord = document.getElementById('bdr').innerHTML;
con = document.getElementById('ct').innerHTML;
div3 = document.getElementById('MS3css').innerHTML;


if (document.getElementById('bg')){
document.getElementById('bgimgEmpty').innerHTML='Background Image: <br /><textarea id="MS3" style="width:250px; height: 55px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" ><img src="'+bgImg+'"></textarea><br />';}
if (document.getElementById('bgtile')){
document.getElementById('bgtileEmpty').innerHTML='Background Tile: <br /><textarea id="MS3" style="width:250px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+tile+'</textarea><br />';}
if (document.getElementById('bgatt')){
document.getElementById('bgattEmpty').innerHTML='Background Attachment: <br /><textarea id="MS3" style="width:250px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+att+'</textarea><br />';}
if (document.getElementById('bgpos')){
document.getElementById('bgposEmpty').innerHTML='Background Position: <br /><textarea id="MS3" style="width: 250px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+pos+'</textarea><br />';}
if (document.getElementById('mar')){
document.getElementById('marEmpty').innerHTML='Marquee: <br /><textarea id="MS3" style="width:250px; height: 55px; background: #999999; color: #000000; padding: 2px;"><a href="http://skemaholicsanonymous.com/"><img src="'+top+'"></a></textarea><br />';}
if (document.getElementById('marht')){
document.getElementById('marhtEmpty').innerHTML='Marquee Height: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+ht+'</textarea><br />';}
if (document.getElementById('sel')){
document.getElementById('selEmpty').innerHTML='Selected: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+alink+'</textarea><br />';}
if (document.getElementById('bgcol')){
document.getElementById('bgcolEmpty').innerHTML='Background Color: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+col+'</textarea><br />';}
if (document.getElementById('hdr')){
document.getElementById('hdrEmpty').innerHTML='Header: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+hed+'</textarea><br />';}
if (document.getElementById('bdr')){
document.getElementById('bdrEmpty').innerHTML='Borders: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+bord+'</textarea><br />';}
if (document.getElementById('ct')){
document.getElementById('ctEmpty').innerHTML='Content: <br /><textarea id="MS3" style="width:60px; height: 25px; background: #999999; color: #000000; padding: 2px;"  onclick="select()" >'+con+'</textarea><br />';}

if (document.getElementById('MS3css')){
document.getElementById('code2Empty').innerHTML='<form id="genDone"action="http://blog.skemaholicsanonymous.com/MSPreview3/preview.php" method="post" rel="nofollow" target="_blank"><textarea id="codebox"  style="display: none;" name="genCode">'+div3+'</textarea><br /><input type="submit" value="Preview" id="prevLoad" /></form>';}

This is an example piece of code which I wish to add to an onkeydown event:

Code:

function keyListen(param1,param2,e) {
        
        // keycode for ie
        
        if(window.event) {
                e = window.event;
                var keycode = e.keyCode;
        }
        
        // keycode for firefox, safari and opera
        
        else {
                var keycode = e.which;
        }
        
        // if right arrow key was pressed execute a function
        
        if(keycode == '39') {
                someFunction(param1,param2);
        }
}

Then somewhere else in my code I dynamically add the function to an onkeydown event like so:

Code:

document.onkeydown = function() { keyListen(param1,param2,event) };

This works great in Internet Explorer, Opera, Safari and Google Chrome but not Firefox. Firefox keeps reporting that event is not defined, is there a way around this problem?

I have also tried this:

Code:

document.onkeydown = function() { keyListen(param1,param2) };

I excluded the event, but still the same outcome, works well in all browsers apart from Firefox. Please help me, thankyou.

New to this. This code works in IE but does not work in firefox. It just stays on the same page and does nothing. Please Help!

Code:

<table>
<CFFORM action="mypage.cfm METHOD="post" name="Login" rel="nofollow" target="_blank" id="go"> 
    
  
  <cfinput type="hidden" name="decrypted" value="#decrypted#">

  <tr>
        <td>
               <a  class="K" HREF="javascript:document.go.submit();">My Page</a>
        </td>
  </tr>
  
  <tr>
        <td >
                <table>
                          <tr>
                                <td>
                                       <a HREF="javascript:document.go.submit();"><img border="0" src="images/icon.PNG"  align="left" /></a> 
                                </td>
                          </tr>
                </table>
        </td>
   </tr>
   
</CFFORM>
</table>

Hi coders,

I have an .asp page on which you can change the background picture of a cell by simply selecting the desired color from a dropdown field.

When running the page in Firefox its Error console tells me the following:

Error: document.getElementById.bgtd is undefined
Source File: [localhost...]
Line: 29


Here is the code:


<select name=ADDITIONALINFO1 ID="Select1" onchange="changebg(document.forms[0].ADDITIONALINFO1[document.forms[0].ADDITIONALINFO1.selectedIndex].value)">
<option value="White"> White
<option value="Black"> Black
<option value="Blue"> Blue
</select>



And here is the changebg script:


function changebg(color){
if (color=="Black")
document.getElementById("bgtd").background = "img/bg-tshirt5.jpg";
else if (color=="Blue")
document.getElementById("bgtd").background = "img/bg-tshirt_bl.jpg";
else
document.getElementById("bgtd").background = "img/bg-tshirt2.jpg";

document.forms[0].bgimg.value = document.getElementById("bgtd").background;
}


Here is the table where the image is displayed as bachground:

<td width="353" background="img/bg-tshirt2.jpg" height="269" id="bgtd">
<p align="center"><font size="1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <br>
&nbsp;&nbsp;&nbsp;
<img src="<%=imgSrc%>"></font></td>



Internet Explorer does not complain and does the job without any errors.
I Could not find out how to make it work also with Firefox.

Any comments are appreciated.

Hi Coders,

I have a javascript function which lets a user to choose one of the 7 option buttons on a "mainsub.asp" page and the page will then be forwarded to one of the 7 process pages depending on what has been chosen.

The problem is that firefox is angry with the first line ("if" statement) and tells the following in its error console:

Error: document.forms[0].C1 is not a function
Source File: [localhost...]
Line: 117

Here is the code:

function fSubmit(){
if (document.forms[0].C1(0).checked) document.forms[0].action="process.asp";
else if (document.forms[0].C1(1).checked) document.forms[0].action="process1.asp";
else if (document.forms[0].C1(2).checked) document.forms[0].action="process2.asp";
else if (document.forms[0].C1(3).checked) document.forms[0].action="process3.asp";
else if (document.forms[0].C1(4).checked) document.forms[0].action="process4.asp";
else if (document.forms[0].C1(5).checked) document.forms[0].action="process5.asp";
else if (document.forms[0].C1(6).checked) document.forms[0].action="process6.asp";
else document.forms[0].action="process.asp";
return;
}

Internet explorer does not complain about anything and does its job great.
But I could not figure out how to change the code to be also compliant with Firefox?

Thanks for all the comments.

Hi,

I have this web browser which opens up a website that has a drop down list showing values that the user can select. And when I the firebug to inspect the elements in the page, what shows in the inspection window is this:

Code:

<select id="instance2" name="instance2"> 
<option value="0">All instances</option> 
<option value="1">Item0</option> 
<option value="2">Item1</option> 
<option value="3">Item2</option> 
                     . 
                     . 
                     . 
<option value="23">Item22</option>

What I'm supposed to do is to get the values and update them automatically to the database. I'm actually using HtmlUnit to do this project, and I've heard how I can use getElementById() to get the values. But I don't know how to start. I'm a beginner so I might need a lot of help on this matter. Help is kindly appreciated.

Thanks.

i have an onclick function, but after debuging i found that firefox and only firefox blocks at the line

" individualNames = names.childNodes[0].innerText; "
is there somthin im missing please help.

function searchForm()
{
var change = 0;
var searchValue = document.getElementById("searchValue").value.toLowerCase();
var count = document.getElementById("excelTable").rows.length;
var once = true;
myArray = new Array();

if(searchValue == ""){alert("Please enter a value"); return false}

for(i=0;i<=count;i++){

names = document.getElementById("excelTable").rows[i];

individualNames = names.childNodes[0].innerText;




//only by last name of the file coming in format == "LastName, FirstName"
lastName = individualNames.split(", ");
//only by last name

lowerCaseNames = lastName[0].toLowerCase();
names.style.backgroundColor = "#FFF";

if(lowerCaseNames.indexOf(searchValue) != -1)
{
names.style.backgroundColor = "#999";
//make the first result with the search apear on screen than stop after the first
if(once==true){document.getElementById("excelTable").rows[i].scrollIntoView(true); once=false;}


myArray[change] = document.getElementById("excelTable").rows[i];//fill a passing array to next function
change++;//make the array go to next slot

document.getElementById("nextButton").disabled = false;

document.getElementById("searchTitle").scrollIntoView(true);
}
}
}

Hi,
the following does not work in firefox, note that I have removed the < at the beggining of the script in order to see what was being written, what I am trying to acheive is to write the following to an IFRAME using JavaScript, on click of a button:

PHP Code:
<script language=javascript type="text/javascript" runat=server> var fso = new ActiveXObject("Scripting.FileSystemObject"); var f = fso.OpenTextFile("somefile.txt", 2, true); f.WriteLine('lblTitle="Color Setup"'); f.WriteLine('scmdSave="Save"'); f.Close();</Script> 


in order to get this, I wrote a script that goes like this:

PHP Code:
    var frTraductionID = document.getElementById("frTraduction");
    frTraductionID = (frTraductionID.contentWindow) ? frTraductionID.contentWindow : (frTraductionID.contentDocument.document) ? frTraductionID.contentDocument.document : frTraductionID.contentDocument;
    var x=frTraductionID.document.getElementById("hCount").value;
    var ifrm = document.getElementById("ifUPDATE");
    ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
    ifrm.document.open();
    ifrm.document.write('scr' + 'ipt language=javascript type="text/javascript" runat=server>');
    ifrm.document.write('var fso = new Active' + 'XObject("Scripting.FileSystemObject"); ');
    ifrm.document.write('var f = fso.OpenTextFile("' + sFileName + '", 2, true); ');
    for (var i=0;i<x;i+=1) {
        var sString="";
        sString +="f.WriteLine('";
        sString +=frTraductionID.document.getElementById("h"+i).value;
        sString +='="';
        sDetail=frTraductionID.document.getElementById("d"+i).value.replace('"', ' ');
        sDetail=sDetail.replace("'", "`");
        sString +=sDetail;
        sString +='"';
        sString +="')";
        sString +="; ";
        alert("i = " + i + " str = " + sString);
        ifrm.document.write(sString);
    }
    ifrm.document.write("f.Close();");
    ifrm.document.write("<");
    ifrm.document.write("Scr");
    ifrm.document.write("ipt>");
    ifrm.document.close();
    document.getElementById('ifUPDATE').contentWindow.location.reload(true); 


The problem is that the "<" seam to cause problem, I have intentionally removed the first < in order to see what the result was and here is what I get:

PHP Code:
script language=javascript type="text/javascript" runat=server>var fso = new ActiveXObject("Scripting.FileSystemObject"); var f = fso.OpenTextFile("//ADMNPC88/VIP/Language/TEST5/COLOR_SETUP.INC", 2, true); f.WriteLine('lblTitle="Color Setup"'); f.WriteLine('scmdSave="Save"'); f.WriteLine('scmdRestore="Restore"'); f.WriteLine('lblControlHeader="Control`s Header"'); f.WriteLine('lblControlDetail="Control`s Detail"'); f.WriteLine('lblControlDetailHL="Control`s Detail Highlighted"'); f.WriteLine('lblLettering="Lettering"'); f.WriteLine('lblHelp="Drag and drop the desired color on the part of the screen for which you want to change the color."'); f.Close(); 


Note that I am missing the whole tail end </Script>
Please help as I cannot figure it out.

Thank you

This has me completely stumped. I have a multiple select form element in my HTML document that needs to be manipulated by two different sets of context-sensitive controls. One set of controls is marked up as follows:
Code:

<div id="divControls1" name="divControls1" style="display:none">
<form id="fControls1" name="fControls1">
  <input type="button" id="btnAdd" name="btnAdd" value="Add" onClick="addStuff();" />
  <input type="button" id="btnEdit" name="btnEdit" value="Edit" onClick="editStuff();" disabled />
  <input type="button" id="btnDelete" name="btnDelete" value="Delete" onClick="deleteStuff();" disabled />
</form>
</div>

When I load this page into Safari (on Mac OS X) and set the style of divControls1 to "display:block," I have an enabled "Add" button, a disabled "Edit" button, and a disabled "Delete" button, just as I expected. (I monitor selections in a multiple selection element to turn the buttons on and off.)

But when I load this page into Firefox (also Mac OS X), all three buttons are disabled at startup.

My page runs a function called startup() when the body fires onLoad. To try to troubleshoot the problem, I wrote this line at the beginning of the startup() function:
Code:

function startup() {
  alert (document.getElementById("btnAdd").disabled);
  ...

When I run this code in Safari, the alert returns "false" (not disabled), just as I would expect, and intended. However, the same code in Firefox (Mac OS X) returns "true" (disabled) ... but the same code in Firefox (WinXP) returns "false"!

Any insight into what might be happening here?

My code is here and it works ...
However, I would like my dynamic table to show on the same page as my body and not on a new blank page. I have created a DIV and try playing around with the document.getElementById('monTab').innerHTML but it's not working out for me ...

What am i missing ?

Regards,

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>new Script - Javascript Cours 11</TITLE>
<META content="text/html"; charset="UTF-8" http-equiv="content-type">
<SCRIPT type="text/javascript">
	
   

	function createTable(){
	var Etudiant = new Array(Number(prompt("How many Students will you put in ?","")));

	document.write("<table border=\"1\">");
	for (var i=0; i<Etudiant.length; i++) {
	Etudiant[i] = window.prompt("S'il vous plait entrez le nom d'un etudiant " + (i+1) + ".","")
	alert("Nice to see you "+Etudiant[i]);
	
	document.write("<td>"+Etudiant[i]+"</td>");
	j = parseInt(prompt("Combien de notes voulez vous calculez ?"));
	for (h=0;h<j;h++){ 
	notes[h] = parseInt(prompt("S'il vous plait entrez la "+(h+1)+" note de "+Etudiant[i]));
	document.write("<td>"+notes[h]+"</td>");
	}
	
	
	document.write("<tr>");
	}


	
	document.write("</tr>");
	document.write("</table>");
	document.getElementById('monTab').innerHTML=Etudiant;
}


	</script>
<BODY>

<H1>Combien de note voulez vous cumulez ?</H1>
<br>
<br>

<input type="button" name="btnSubmit" value="TRY IT" onclick="createTable()">
<div id="monTab" size="10"> Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ... </div>
</BODY>
</HTML>

I'm using the autofill forms plugin for firefox which can be found he

https://addons.mozilla.org/en-US/firefox/addon/4775

I use it to automatically fill various web forms, duh. But I would like certain values to be chosend randomly from a list I create.

I contacted the developer and he said the add on probably does not need a new feature because there is a 'dynamic tags' function to fill certain forms with dynamic values (e.g. the current time or date). He has given over the project to another developer and told me I probably would find a solution in a good javascript programming forum.

So here I am! Can anyone help me with this? Basically, I just need a javascript code which chooses on item from an array randomly, I guess? I'm not a programmer myself, so any help would be greatly (!) appreciated.

Thanks a lot in advance for any further guidance!

Note: Here are sample dynamic tags from the plugin:

<datetime> new Date().toLocaleString()
<useragent> navigator.userAgent
<langcode> navigator.language
<resolution> screen.width+'x'+screen.height
<clipboard> this.getClipboardText()

I found this line in one of the scripts on javascript.kit

<code>
if(document.layers|| document.getElementById|| document.all)
</code>

Could someone give me an idea on why this line would be used in a code?

Thank you very much

Hi gud mng,

I have one problem...

How to process textbox values/ call textbox values in JS through a Java program.
My text box values are dates. I have to process these dates.

Like in online banking we select day to know our transactions. After submitting we get results. remember my files are in my directory only. No need of database.

My files are look like 20100929, 20100930, 20101001

For epoch_classes.js, epoch_styles.css u can download coding from this link : http://www.javascriptkit.com/script/...ch/index.shtml


Code:


Code:

<html>

<table width="900" border="0" cellpadding="10" cellspacing="10" style="padding:0"> 
<tr><td id="leftcolumn" width="170" align="left" valign="top"> 
<div style="margin-left:0px;margin-top:0px"><h3 class="left"><span class="left_h2">Select Option</span></h3> 
<a rel="nofollow" target="_top" href="day_wise.htm" >Day-wise</a><br />  <br />
<a rel="nofollow" target="_top" href="between.htm" >Between Days</a> 

<link rel="stylesheet" type="text/css" href="epoch_styles.css" />


<script type="text/javascript" src="epoch_classes.js"></script>

<script type="text/javascript">

var cal1, cal2;      
window.onload = function () 
{
cal1= new Epoch('epoch_popup','popup',document.getElementById('popup_container1'));
cal2= new Epoch('epoch_popup','popup',document.getElementById('popup_container2'));
};

/*............*/
function confirmation(f) 
{
	
	var startdate = f.fromdate.value
        var enddate = f.todate.value
        var myday=new Date()

        var yr=myday.getFullYear()
        var mn=myday.getMonth()+1
        var dt=myday.getDate()

        var today=""
        var present, ys, ms, ds, ye,me,de, start, end
           
        if(mn < 10) {  mn = "0" + mn }

        if(dt <10) { dt = "0" + dt } 
 
        today= yr + "/" + mn + "/" + dt
	
        present=yr + "/" + mn + "/" +dt

                     
        if (today < startdate ) 
           {
            alert (" Start date should not be exceed to-day's date " + present )
            startdate.focus()
            return false
           } 
  
        if (today < enddate )
           {
            alert (" End date should not be exceed to-day's date " + present )
            enddate.focus()
            return false
           }

         

         if (today == startdate ) 
           { 
            alert(" You are selected to-days date as Starting day" );
           

            }
   
        var answer = confirm("Do you want to continue ?")        

        if (answer)
           {    if( startdate < enddate)         
		 alert("Dates between " + startdate + " to " + enddate + " are confirmed" )
		else
                  alert("Dates between " + enddate + " to " + startdate + " are confirmed" )     
	   }
	
        else
           {
		alert("Date not confirmed")
                window.location="to_date.htm"; 
           }

        ys= startdate.substring(0,4);
	ms= startdate.substring(5,7);
	ds= startdate.substring(8,10);

        start=ys + "" + ms + "" +ds          
  
        ye= enddate.substring(0,4);
	me= enddate.substring(5,7);
	de= enddate.substring(8,10);
 
        end=ye + "" + me + "" +de

      
}
/*.......................................................*/
</script>

<div style="margin-left:100px;">


<body>
<style type="text/css">
#conf
{
margin-left:115px;
} 
</style>


<td align="left" valign="top"> 
<table width="100" border="0" cellpadding="0" cellspacing="0"> 
<td style="padding-top:0px"> 
</table>

<h4>From Date</h4>

<form name= "formbet" id="placeholder" method="post" action="#" >
<input id="popup_container1" type="text" name= "fromdate" maxlength="10" size="20"/>


<td align="left" valign="top"> 
<table width="300" border="0" cellpadding="0" cellspacing="0"> 
<td style="padding-top:20px"> 


<h4>To Date</h4>
<input id="popup_container2" type="text" name= "todate" maxlength="10" size="20"/> <br /> <br />
<input id="conf" type="button" onclick="confirmation(this.form)" value="Submit">
</form>


</body>
</html>

In my coding, ys, ms, ds represents year starting, month starting, starting day...
ye, me, de represents end...

start,end gives file names in the format of yyyymmdd

now i want to process files from 20100101 to 20100930

means from date is 2010/01/01 and to date is 2010/09/30

if i press submit button the files from 20100101 to 20100930 are processes

here ys=2010 ms=01 ds =01 and ye=2010 me=09 de= 30

For this how do i call these textbox values (from date text box and todate) to another program (java)

Thanks in advance.

I have a bunch of checkboxes like below that the user can check some or all and click the button and see the values of all the selected checkboxes. How can I do that?

Code:

<script>
function alertValues(){


}
</script>


<input type="checkbox"  class ="normal2" value="131971" name="list[]" >
<input type="checkbox"  class ="normal2" value="131973" name="list[]" >
<input type="checkbox"  class ="normal2" value="131975" name="list[]" >
<input type="checkbox"  class ="normal2" value="131977" name="list[]" >

<input type="button" onClick="alertValues()"