|
JavaScript - Undifined Variables, A Constant Issue In My Javascript Programs
Hello,
I am a newbie at JavaScript programming and I am continuously running into the same error: "the variable is undefined" In the below js code, I am attempting to write a yearly calendar into an html file. I have followed the instructions from a text, and I am fairly certain that I have followed them correctly. From what I can see the problem is that my calendarDay variable is undefined. How can I fix this, and better yet prevent it from happening again? The portion of my JavaScript code that is causing the error is below and once again I really appreciate your feedback ... Code: /* The purpose of this function is to place a monthly calendar within a larger table cell. */
function writeMonthCell(calendarDay, currentTime) {
document.write("<td class='yearly_months'>");
writeMonth(calendarDay, currentTime);
document.write("</td>");
}
/* Insert a function named yearly(). The purpose of this function is to write the entire yearly calendar containing all of the seperate monthly calendars as cells within the larger table. The function has a single parameter named calDate. */
function yearly (calDate) {
if (calDate == null) calendarDay = new Date() // loads the current date and time
else calendarDay == new Date (calDate); // first error "calendarDay is not definded"
var currentTime = calendarDay.getTime(); // retrieves the current time in milliseconds
var thisYear = calendarDay.getFullYear(); // retrieves the four digit value for the year
// the following writes the calendar title
document.write("<table id='yearly_table'>");
document.write("<tr>");
document.write("<td id='yearly_title' colspan='4'>");
document.write(thisYear);
document.write("</th>");
document.write("</tr>")
var monthNum = -1; //var monthNum will keep track of the month value being written in the calendar
// the following writes the calendar table
for (var i = 1; i <= 3; i++) {
document.write("<tr>");
for (var j = 1; j <=4; j++ ) {
monthNum = monthNum +1;
calendarDay.setDate(1);
calendarDay.setMonth(monthNum);
writeMonthCell(calendarDay, currentTime);
}
document.write("</tr>");
}
document.write("</table>");
Similar Tutorialsive just started really to develop my javascript out of individual functions and appreciate and help with this. I start outside of the external JS file by: reviews.init(); reviews.initialiseContent('comment'); This loads my data and loads + sets the comment tab as default. My problem is that in the external JS file (shown below) the loadTabs variable will not allow me to pass it a variable: contentDiv.onclick = this.initialiseContent; Whenever I pass a variable here it errors, am I setting this up correctly, should I be using prototype for my this. variables? Interested to hear back on if this structure of code is the right way to go about this and also how I can pass a variable in this way Thanks, Phil Code: var reviews = new reviews();
var xmlhttp;
var classArray = Array('comment', 'review', 'video', 'stats', 'add');
function reviews(){
/*--------------------------------------------*/
// Setup tab events, rating and thumb content
/*--------------------------------------------*/
this.init = function()
{
/*--------------------------------------------*/
// Load and display tabs
/*--------------------------------------------*/
this.loadTabs();
/*--------------------------------------------*/
// Load and display rating
/*--------------------------------------------*/
this.loadRating();
/*--------------------------------------------*/
// Load and display thumbs
/*--------------------------------------------*/
this.loadThumbs();
}
/*--------------------------------------------*/
// Initialise and populate tab
/*--------------------------------------------*/
this.loadTabs = function()
{
for(key in classArray)
{
var contentDiv = document.getElementById( 'pp-content-tab-' + classArray[key] );
contentDiv.style.cursor = 'pointer';
contentDiv.onclick = this.initialiseContent;
}
document.getElementById('pp-content-tab-add').style.visibility = 'hidden';
document.getElementById('add-review').style.cursor = 'pointer';
document.getElementById('add-review').onclick = this.showElement;
}
this.showElement = function()
{
document.getElementById('pp-content-tab-add').style.visibility = 'visible';
this.id = 'pp-content-tab-add';
this.initialiseContent;
}
this.initialiseContent = function( tab )
{
if( this.id )
{
var tab = this.id.substring( 15 );
}
if( !in_array( tab, classArray ) )
{
var tab = 'comment';
}
for(key in classArray)
{
if( classArray[key] == tab )
{
document.getElementById( 'pp-content-tab-' + classArray[key] ).className = 'pp-tabon';
} else {
document.getElementById( 'pp-content-tab-' + classArray[key] ).className = 'pp-taboff';
}
}
sendrequest( tab, 'loadtab', stateChanged );
}
For the first program I am trying to have the user input the password "stamp" to advance to the next page which is a pizza menu. The first program is supposed to give the user 3 tries and if they do not get it correct an alert is to pop up and tell them how many tries they have left. If they do not get it correct the input field for the riddle is to be locked. However if they have it correct they should be forwarded to the pizza menu. Code: <html>
<body>
<FORM name= "myForm">
<h3> What goes around the world but stays in a corner?</h3>
<br>
<INPUT type="password" name="passPhrase" id="pass">
<script language= "javaScript">
alert("Enter the correct password to proceed");
function checkpass(form)
{
if(form.passPhrase.value == "stamp")
{
alert("page unlocked!");
form.compute.disabled = false;
form.authenticate.disabled = true;
}
else
alert("that is not the correct response!");
</form>
}
</script>
</body>
</html>
For the second program I am having a few small problems, I need to make a button that updates and clears the order. The updated order is supposed to be displayed in the text box that I have at the bottom. Also I am trying to make a function that computes the total cost for the order. Code: </head> <body> <body bgcolor="Silver"> <p> <center> <form method="post" > <p><font size="+4"><strong><font color="#000000">Lance's Pizza <br></font><font size="+4"><strong><font color="#000000"><img src="pizza.jpg" width="163" height="134"></font></strong></font></strong></font></p> <center> <p><strong> Pizza Size:</strong></p> <p> <input type="radio" name="size" value="mini" id="Size_mini"> Mini 14in [$9.99] <input type="radio" name="size" value"=medium" id="Size_Medium"> Medium 16in [$12.99] <input type="radio" name="size" value="large" id="Size_Large"> Large 18in [$15.99] </p> <p><strong>Toppings:</strong>: <center> <input name="toppings" type="checkbox" id="Pepperoni"> Pepperoni [$0.50] <input name="toppings" type="checkbox" id="Suasage"> Sausage [$1.00] <input name="toppings" type="checkbox" id="Greenpeppers"> Green peppers [$0.25] <input name="toppings" type="checkbox" id="Onions"> Onions [$0.25] </p> <input name="toppings" type="checkbox" id="Mushrooms"> Mushrooms [$0.50] <input name="toppings" type="checkbox" id="Olives"> Olives [$0.25] <p> <TEXTAREA NAME="" ROWS="10" COLS="40" onBlur="blurHandlerRouting"> </TEXTAREA> <br><input name="clear" type="button" value="Clear" onClick="Reset();"> </p> </form> </p> </body> </html> Hi, I have the following code snippet: test.html ====== <script language="javascript" type="text/javascript"> var testVariable = "test"; </script> <script language="javascript" type="text/javascript" src="test.js"> </script> test.js ===== var testVariable = window.top.testVariable; In firefox, I'm able to access testvariable defined within test.html in test.js. But in chrome, test.js couldnot get the window.top.testVariable field defined in test.html. Can any one please let me know how i can make it work in chrome?. Am i missing something here?. All -- I have a JavaScript config file called gameSetting.js which contains a bunch of variables which configures a particular game. I also have a shared JavaScript library which uses the variables in gameSetting.js, which I include like so: <script type="text/javascript" src="gameSetting.js" ></script> <script type="text/javascript" src="gameLibrary.js" ></script> In gameSetting.js I have: $(document).ready(function() { // call some functions / classes in gameLibrary.js } in Firefox, Safari, and Chrome, this works fine. However, in IE, when it's parsing gameSetting.js, it complains that the functions that live in gameLibrary.js aren't defined. When it gets to parsing gameLibrary.js, the variables in gameSetting.js are reported as not being defined. I've tried dynamically bootstrapping the gameLibrary file using this function in document.ready for dynamic load... $.getScript("gameLibrary.js"); However, the same problem still happens in IE, where when it parses the files individually it's not taking into context the file/variables that came before, so it's not an out of load order problem. My options a 1) collapsing all the functions in gameLibrary.js and variables in gameSetting.js into one file. However, this is not practical because this is dealing with literally hundreds of games, and having a gameLibrary.js in ONE location for ONE update is what makes most logical sense. 2) figure out a way to get this to work where variables in file1 are accessible to file2 in IE (as it seems they are in other browsers). jQuery seems to be able to have multiple plugins that all refer to the based jQuery-1.3.2.js, so I know there is a way to get this to work. Help appreciated. Nero Hi, Ive got a iphone based website im writing in html/javascript, it all works perfectly well apart from an issue with a javascript variable and i cant figure out what im doing wrong At the start of the code i declare a variable var jpgname='blank'; - its blank for testing I then have a href which attempts to change this variables value when clicked <li class="flip"><a onClick="jpgname='test'" href="#page">Cars</a></li> If i replace the jpgname='test' with confirm('test) i get a popupbox so i know its running this code under my #page section (just a div named section) i have [<h1><script>document.write(jpgname);</script></h1> however this always has the value 'blank' Im sure im doing something stupid but im not sure what Any help gratefully recieved thanks Mike Hi, I'm looking to use the document function in javascript to change the TYPE of an INPUT. However I want to change the TYPE of the INPUT according to a variable passed to the javascript button, so i use: document.formname.inputname.value="newvalue"; I want to be able to change what inputname is depending on what is passed to the function, but right now firefox is telling me that it's undefined. Is there any way I can do this? Thanks in advance, Daniel I am perplexed about this one. Not sure if php is the best solution or maybe javascript. ( or both.) I am writing a litle script that will go to my mysql table and take out 20 rows ( from about 10,000 rows ) based on the WHERE statement. Then I want to step through these 20 rows displaying just two filds in this fashion: First, I want to display one field in a "box" ( using divs and css ) then wait for a form input. Then while keeping the first displayed box and field display the second field in a similar box a fee lines below. Wait for a form input update some data. Then onto the next row. If I use javascript then I could keep all the processing on one page and not have to have server refreshes. But how do I get these those array elements from $row['field1'] and $row['field2'] into javascript vars ? Is this the best way to do this ? Or would php and having a couple of extra trips to the server for form processing be better ? Thanks for any input. . Hi is it possible to compare 2 php variables with javascript and hide-show a div according to the result? lets say php variables are Code: $a $b and if ($a > $b) show the div can anyone please help me to do this? Sorry for language errors Thanks Hi all, I'm a javascript newbie and having some trouble with what I imagine it s a very basic issue! I am trying to declare a variable inside a function and use it later on in my code... but it just already returns white space... i.e. not variable value. I am setting it within this function: Code: function show_video1(){
document.getElementById('video1').style.display="block";
var video1Name = "Education World News (Part 1)";
document.getElementById('video2').style.display="none";
document.getElementById('video3').style.display="none";
document.getElementById('video4').style.display="none";
document.getElementById('video5').style.display="none";
document.getElementById('video6').style.display="none";
document.getElementById('video7').style.display="none";
document.getElementById('video8').style.display="none";
document.getElementById('video9').style.display="none";
document.getElementById('video10').style.display="none";
document.getElementById('video11').style.display="none";
}
and trying to call it later on with this: Code: <script type="text/javascript">document.write(video1Name)</script> It might be worth noting that each one of my 11 videos will hace a different name. Can anyone help out a newbie? Many thanks, greens85 Hi, I am using javascript to collect hidden form elements and then send the values to a php page, without reloading or changing the page. Basically i have a list of job vacancies, with just an apply button, when a person clicks on the apply button, the form collects some information from their account and sends it using the javascript code. Now this works fine, except for if somebody then clicks on the second job it sends the information from the first form again. And it seems to remember the information. What i am trying to find out is it possible to have multiple forms on one page which once submitted send variables to javascript which then send them to a php but clear themselves so that it doesn't remember the previous values. Here is the code for the form: Code: <form id="submit" method="post">
<fieldset>
<input type="hidden" name="usern" id="usern" value="php variable" />
<input type="hidden" name="joborder_id" id ="joborder_id" value="php variable" />
<input type="hidden" name="site_id" id ="site_id" value="php variable" />
<button class="button positive">Apply For This Job </button>
</fieldset>
</form>
<div class="success" style="display: none;">Your Application has been sent.</div>
</form>
And the Javascript code is he Code: $(document).ready(function(){
$("form#submit").submit(function() {
// we want to store the values from the form input box, then send via ajax below
var usern = $('#usern').attr('value');
var joborder_id = $('#joborder_id').attr('value');
var site_id = $('#site_id').attr('value');
$.ajax({
type: "POST",
url: "apply.php",
data: "usern="+ usern +"& joborder_id="+ joborder_id +"& site_id="+ site_id,
success: function(){
$('form#submit').hide(function(){$('div.success').fadeIn();});
}
});
return false;
});
});
Any ideas or suggestions would be appreciated, Thanks Lee Hi, I hope someone can help me! I have a list of buttons, each with a different id which is taken from the ids of these values from the database. When I click one of the buttons it shows the items that correspond to this id in the database. Therefore, when different buttons are clicked the display changes to match the objects relating to this particular button. When a button is clicked, this shows various other objects which I can then select (using a checkbox). When a checkbox is clicked, a Javascript function is called to change the html text next to the appropriate button. However, I can't get this to work as I need to pass the id of the button, and the html span, to the Javascript in order to change the correct text. Here is my Javascript : Code: function questionnum(checkbox) {
if(checkbox.checked) {
var qdesNumElement = document.getElementById('<?php echo $q;?>');
var qdesNum = qdesNumElement.innerHTML;
qdesNumElement.innerHTML = ++qdesNum;
}
This code only gets the last button. Please help. I am about to translate some C++ code to JavaScript. In C++, it is straightforward to declare and use a Boolean variable; all I do is swap it between true and false and back again as needed. For example, Code: // C++ Code . . . bool na = 1; . . . na = !na; . . . I am wondering if JavaScript offers boolean variables. As far as I know, it does not, but I thought I would confirm by asking around. At the moment, I am planning to code the comparable block in Javascript using an "if" statement or a ternary operation. For example, Code: JavaScript Code . . . var na = 1; // Option 1 if (na) na = 0; else na = 1; // Option 2 na = ((na) ? 0 : 1); . . . Is one of these options recommended as the best way to simulate a boolean variable and operation? (I would like the fastest-executing code possible.) Or is there another--better--way to do it? All advice and recommendations appreciated. Thank-you in advance. I have jQuery like: jQuery(".forms_1_1").validate({ rules: { inputname1: { required: true, }, or inputname1: { required: "Requested field!.", }, Is it technically possible to add 1. PHP variable like $_SESSION and 2. Smarty variable into Javascript like {$global.variable1} inputname1 is value for each variable (PHP, Smarty). Need help how to include variable values into Javascript code. How can I have global variables and global arrays whose value(s) can be modified and accessed by all the Javascript functions in my HTML document as well as by the HTML code? Thank You CGG Hello Im using javascript and cookies to send to another page in my site some variables In the other page i recieve them like that : Code: <script language="JavaScript">
if (widget_array != ""){
for (i=1; i < widget_array.length; i++){
document.write("<h3>" + widget_array[i] + "</h3>");
}//ends diplay FOR
}//ends widget display
if(ninja_array != ""){
for (i=1; i < ninja_array.length; i++){
document.write("<h3>" + ninja_array[i] + "</h3>");
}//ends FOR
}//ends ninja display
</script>
Now my question is ....(and this is the php - sql question) how can i make the variable the i passed to stay a variable , e.g. variable page 1: id=123 *i entered the number 123 into the cookie variable page 2: now this page will show me ALL the array ( 123...134...156...etc...) but i dont want it to print it on the screen i just want to get variables that i can use php-mysql e.g. $id=123 in order to print the specific data from my data base hope u got it.... Danny Hi, in PHP I can assign a variable do... PHP Code: function setvar($anyvar,$val){ $$anyvar=$val; } setval('myvar',$whatever); how to do in javascript ... I thied window.anyvar= and this[anyvar] and several other combinations but no joy Edit: fixed, my bad, was being a muppet, was calling setvar(varname,val) instead of setvar('varname',val); Hi, I am trying to print a hard copy from a database using php and javascript. this is my console display: Code: Uni ID Name i1111111 ................................. Maeve O'Neill and this is the best I can make up from my keyboard as to the hard copy output: Code: Uni ID Name |||||||| |||||||||||||||||||||||| 0 DHYH 2 |1 HOQD The php/html code is: Code: echo "<tr bgcolor=lightsteelblue> <th align=left><font face=\"Times\" size=\"3\">Uni ID</font></th> <th align=left><font face=\"Times\" size=\"3\">Name</font></th> </tr> "; echo "<font face=\"courier\"size=\"3\"><tr><td>$row[username]</font></td> <font face=\"courier\"size=\"3\"><td>$row[forename]</font></td> <font face=\"courier\"size=\"3\"><td>$row[surname]</font></td><br/> "; and the javascript is: Code: var display_setting="toolbar=yes,location=no,directories=yes,menubar=yes,";
display_setting+="scrollbars=yes,width=750, height=600, left=100, top=25";
var content_innerhtml = document.getElementById("printArea").innerHTML;
var document_print=window.open("","",display_setting);
document_print.document.open();
document_print.document.write('<html><head><title>Print using javascript </title></head>');
document_print.document.write('<body style="font-family:arial; font-size:16px;" onLoad="self.print();self.close();" >');
document_print.document.write(content_innerhtml);
document_print.document.write('</body></html>');
document_print.print();
document_print.document.close();
return false;
It is printing out the words I have given it but not the php variables. I can't for the life of me see where I am losing the encoding and I also can't find anything on web searches as I cannot copy the rubbish that is coming out to try a search on it :-( Any help would be appreciated, thanks. I cant figure out how to get the value of a name inputed in HTML into the following script... <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)"> <meta name="created" content="Sat, 10 Sep 2011 19:40:31 GMT"> <meta name="description" content=""> <meta name="keywords" content=""> <title>Enter golfers name</title> <!--[if IE]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <SCRIPT LANGUAGE="JavaScript" type="text/javascript" src="script1.js"></SCRIPT> <SCRIPT LANGUAGE="JavaScript"> function GetPage(){ document.write("OK") <!-- var fullname = "david park" var lab = ""; var result = fullname.toUpperCase(); var word=result.split(" "); fname = word[0] lname = word[1] alpha = lname.slice(0,1); lab = fname.concat("_") lab = lab.concat(lname) if(word[2]){ ext = word[2] lab = lab.concat("_") lab = lab.concat(ext) } var intro = "./Stats_"; page = intro.concat(alpha); page = page.concat("_golfers.html#"); page = page.concat(lab) document.write(page) <!-- window.location.pathname = page } </script> </head> <body> <center> <form action="form_action.asp" method="get"> You can enter the golfersname or select him from the above list.<br><br> <input type="text" name="fullname" /> <button type="submit" onclick="GetPage()">GO</button> </form> </center> <BR><BR><BR> This is the end </body> </html> I have an array from a sql query that I need to use as variables in a javascript function. I have created the array, used JSON_ENCODE to bring the information into javascript, and so far everything works correctly. I am trying to use a list menu in html to select one on the indexes of the array so I can pass the information from the index to a javascript function. Here is the javascript function: Code: function selectTable(item_id)
{
var media = eval(<? echo json_encode($paperTable); ?>);
var click_k_1=media[item_id]["click_k_1"];
var click_k_501=media[item_id]["click_k_501"];
var click_c_1=media[item_id]["click_c_1"];
var click_c_51=media[item_id["click_c_51"];
var click_c_101=media[item_id]["click_c_101"];
}
Here is the list menu coding: Code: <select name="pprSel" size="1" id="pprSel" onChange="selectTable(this.value);" > <option value="204226">20# Bond</option> <option value="204788">70# White</option> <option value="204823">80# White</option> </select> Here is the source file results from the browser: Quote: function selectTable(item_id) { var media = eval({"1":{"item_id":"204226","item_description":"20# Bond","click_k_1":"0.1100","click_k_501":"0.0730","click_c_1":null,"click_c_51":null,"click_c_101":n ull},"2":{"item_id":"204788","item_description":"70# White","click_k_1":"0.1149","click_k_501":"0.0779","click_c_1":"0.8789","click_c_51":"0.5539","click _c_101":"0.3589"},"3":{"item_id":"204823","item_description":"80# White","click_k_1":"0.1591","click_k_501":"0.1221","click_c_1":"0.9231","click_c_51":"0.5981","click _c_101":"0.4031"}}); } I have tried a couple of different ways to pass one of the variables to a text field on the html form as an error check, with no success: Code: document.quote.data.value=media[item_id]["click_k_1"]; document.quote.data.value=click_k_1; The text field on the html form is id='data', the form is id='quote'. the only thing I can think of for the reason I am not getting anything in my text field is that my variable is not getting set up properly. Can anyone help? TIA |
|||||||