Safari and form variables in html page

J

justplain.kzn

Hi,

I have a table with dynamic html that contains drop down select lists
and readonly text boxes. Dynamic calculations are done on change of a
value in one of the drop down select lists.

Using Safari,my first iteration the script works fine ( indicating that
there
are 33 form variables ). When trying another dropdown select value, the

form elements.length is shown as 33 ( as about ) BUT the script then
crashes with a 'null value' error. I cannot access any of the form
variables - this works in all other browsers and platforms.


Anyway ideas would be great appreciated...


Cheers
<HTML>

<HEAD>
<TITLE>GPA Estimator</TITLE>
<STYLE>
..ie {visibility:hidden}
..ns {visibility:hide}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">

// grade object constructor
function grade(grade, honorPoints, creditAttempt, creditEarned,
creditGPA, showable, editable) {

this.grade = grade;
// String
this.honorPoints = honorPoints; // float
this.creditAttempt = creditAttempt; // boolean
this.creditEarned = creditEarned; // boolean
this.creditGPA = creditGPA; //
boolean
this.showable = showable; //
boolean
this.editable = editable; //
boolean
}

gradeList = new Array();
gradeList[0] = new grade("No
grade", 0, false, false, false, true, true);
gradeList[1] = new grade("A", 4, true, true,
true, true, false);
gradeList[2] = new grade("A-", 3.7, true, true,
true, true, false);
gradeList[3] = new grade("B+", 3.3, true, true,
true, true, false);
gradeList[4] = new grade("B", 3, true, true,
true, true, false);
gradeList[5] = new grade("B-", 2.7, true, true,
true, true, false);
gradeList[6] = new grade("C+", 2.3, true, true,
true, true, false);
gradeList[7] = new grade("C", 2, true, true,
true, true, false);
gradeList[8] = new grade("C-", 1.7, true, true,
true, true, false);
gradeList[9] = new grade("D", 1, true, true,
true, true, false);
gradeList[10] = new grade("F", 0, true, false,
true, true, false);
gradeList[11] = new
grade("AU", 0, false, false, false, false,
false);
gradeList[12] = new grade("H", 0, true, true,
false, false, false);
gradeList[13] = new grade("J", 0, true, false,
false, false, false);
gradeList[14] = new grade("MG", 0, false, false,
false, true, true);
gradeList[15] = new
grade("NC", 0, false, false, false, false,
false);
gradeList[16] = new grade("P", 0, true, true,
false, false, false);
gradeList[17] = new grade("W", 0, true, false,
false, false, false);
gradeList[18] = new grade("X", 0, false, false,
false, true, true);
gradeList[19] = new grade("I", 0, false, false,
false, true, true);

function getHonorPoints(grade) {
for (var i = 0; i < gradeList.length; i++) {
if ( gradeList.grade == grade) {
return gradeList.honorPoints;
}
}
}

function isCreditAttempt(grade) {
for (var i = 0; i < gradeList.length; i++) {
if ( gradeList.grade == grade) {
return gradeList.creditAttempt;
}
}
}

function isCreditEarned(grade) {
for (var i = 0; i < gradeList.length; i++) {
if ( gradeList.grade == grade) {
return gradeList.creditEarned;
}
}
}

function isCreditGPA(grade) {
for (var i = 0; i < gradeList.length; i++) {
if ( gradeList.grade == grade) {
return gradeList.creditGPA;
}
}
}

function isShowable(grade) {
for (var i = 0; i < gradeList.length; i++) {
if ( gradeList.grade == grade) {
return gradeList.showable;
}
}
}

function getSelect(suffix,postedgrade) {
var select = "";
var selectName = "gradesList_" + suffix;
select += "<SELECT NAME='" + selectName + "'
onChange=update(this.form," + selectName + ")>";
for (var i = 0; i < gradeList.length; i++) {
if (gradeList.showable) {
select += "<OPTION VALUE='" + gradeList.grade
+ "'";
// if (i == 0) {
if (gradeList.grade == postedgrade) {
select += " SELECTED";
}
select += ">" + gradeList.grade;
}
}
select += "</SELECT>";
return select;

var honorPointsPrefix = "honorPoints_";
var gradePointsPrefix = "gradePoints_";
var decplaces = 2;
var previousSemesters = "Previous Semesters";
var J_grade = false;

sem = new Array();
sem[0] = new semesterName("1", "SUMMER1");
sem[1] = new semesterName("2", "SUMMER2");
sem[2] = new semesterName("3", "FALL");
sem[3] = new semesterName("4", "SPRING");

courseList = new Array();

function getGradePoints(credits, points) {
return parseFloat (credits) * parseFloat (points);
}

function format (expr, decplaces) {
var str = "" + Math.round (eval(expr) * Math.pow(10,decplaces))
while (str.length <= decplaces) {
str = "0" + str
}
// establish location of decimal point
var decpoint = str.length - decplaces
// assemble final result from: (a) the string up to the position
of
// the decimal point; (b) the decimal point; and (c) the balance
// of the string. Return finished product.
return str.substring(0,decpoint) + "." +
str.substring(decpoint,str.length);
}

function getTotalCredits(semester) {
var totalCredits = 0;
for (var i = 0; i < courseList.length; i++) {
if (isCreditGPA(courseList.grade) && (
courseList.semesterCode
== semester || semester == null)) {
totalCredits +=
parseFloat(courseList.credits);
}
}
return totalCredits;
}

function getTotalGradePoints(semester) {
var totalGradePoints = 0;
var honor;
for (var i = 0; i < courseList.length; i++) {
if (isCreditGPA(courseList.grade) && (
courseList.semesterCode
== semester || semester == null)) {
honor = getHonorPoints(courseList.grade);
totalGradePoints +=
parseFloat(courseList.gradePoints);
}
}
return totalGradePoints;
}

function getEarnedCredits(semester) {
var credits = 0;
for (var i = 0; i < courseList.length; i++) {
if (isCreditEarned(courseList.grade) && (
courseList.semesterCode == semester || semester == null)) {
credits += parseFloat(courseList.credits);
}
}
return credits;
}

function getGPA(semester) {
var gpa = parseFloat(getTotalGradePoints(semester)) /
parseFloat(getTotalCredits(semester));
if (isNaN(gpa)) {
return 0;
} else {
return gpa;
}
}

function semesterName(code,fullName) {
this.code = code;
this.fullName = fullName;
}

function fullSemesterName(semesterCode) {
var semester = "";
var year = semesterCode.substring(0, semesterCode.length - 1);
temp = semesterCode.substring(semesterCode.length - 1);
for (var i = 0; i< sem.length; i++) {
if (temp == sem.code) {
semester += sem.fullName;
break;
}
}
if (temp != "4") {
year = year -1;
}

return semester + " " + year;
// return temp + " " + year;
}

function assembleTable(semester) {
var content = "";
// start assembling HTML for raw tabl
content += "<TABLE ALIGN='center' BORDER>";
// heads of each column
content += "<TR><FONT
SIZE=-1><TH>Course</TH><TH>Semester</TH><TH>Credits</TH><TH>Grade</TH><TH>Honor
Points</TH><TH>Grade Points</FONT></TH></TR>";
for (var i = 0; i < courseList.length; i++) {
if (courseList.semesterCode >= semester || semester
== null
|| courseList.grade == 'I' ||
courseList.grade == 'X'
|| courseList.grade == 'MG' ||
courseList.grade == 'No grade')
{
content += "<TR>";
content += "<TD><FONT SIZE=-1>" +
courseList.course +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.semesterName +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.credits +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
getSelect(i,courseList.grade) +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1><INPUT TYPE='text'
NAME='" +
honorPointsPrefix + i
+ "' value=" + courseList.honorPoints
+ " SIZE=10 DISABLED
onFocus=''></FONT></TD>";
content += "<TD><FONT SIZE=-1><INPUT TYPE='text'
NAME='" +
gradePointsPrefix + i
+ "' value=" + courseList.gradePoints
+ " SIZE=10 DISABLED
onFocus=''></FONT></TD>";
content += "</TR>";
}
}
content += "</TABLE>"
return content;
}


function assembleTablePrevious(semester) {
var content = "";
// start assembling HTML for raw tabl
content += "<TABLE ALIGN='center' BORDER>";
// heads of each column
content += "<TR><FONT
SIZE=-1><TH>Course</TH><TH>Semester</TH><TH>Credits</TH><TH>Grade</TH><TH>Honor
Points</TH><TH>Grade Points</FONT></TH></TR>";
for (var i = 0; i < courseList.length; i++) {
if (courseList.semesterCode < semester) {
content += "<TR>";
content += "<TD><FONT SIZE=-1>" +
courseList.course +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.semesterName +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.credits +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.grade +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.honorPoints +
"</FONT></TD>";
content += "<TD><FONT SIZE=-1>" +
courseList.gradePoints +
"</FONT></TD>";
content += "</TR>";
}
}
content += "</TABLE>"
return content;
}

// course object constructor
function course (course, credits, grade, semesterCode, semesterName,
courseTitle) {
this.course = course;
this.credits = credits;
if (grade =="J") {
J_grade = true;
}
this.grade = grade;
if (grade == "" || grade =="J" || grade == "MG") {
if (grade == "") {
this.grade = gradeList[0].grade;
}
this.editable = true;
} else {
this.editable = false;
}
this.semesterCode = semesterCode;
this.semesterName = fullSemesterName(semesterCode);
this.courseTitle = courseTitle;
this.honorPoints = getHonorPoints(this.grade);
this.gradePoints = format(getGradePoints(this.credits,
this.honorPoints),1);
}

var mess= "";
function isJGrade() {
if (J_grade) {
alert("You have a class with a 'J' grade. If you enter
a grade for
the second half of this 'J' grade class - the cumulative GPA estimation
will not be accurate.");
// J_grade = false;
}
}

function showResult(form) {
// alert("I am " + navigator.userAgent.toLowerCase());
// if (checkBrowser('safari')) {
// alert("I am Safari");
// window.close();
// } else {
form.currentGradePoints.value =
format(getTotalGradePoints(currentSemesterCode), 1);
form.currentCredits.value =
getTotalCredits(currentSemesterCode);
form.currentGpa.value =
format(getGPA(currentSemesterCode),
decplaces);
form.currentEarnedCredits.value =
getEarnedCredits(currentSemesterCode);
form.totalGradePoints.value =
format(getTotalGradePoints(null), 1);
form.totalCredits.value = getTotalCredits(null);
form.gpa.value = format(getGPA(null), decplaces);
form.totalEarnedCredits.value = getEarnedCredits(null);
// }
}

function update(form, select) {
var work = select.name.split("_");
//alert("kuku/" + work[1] + " form.elements.length==" +
form.elements.length);
courseList[work[1]].grade =
select.options[select.selectedIndex].value;
//alert("grade==" + courseList[work[1]].grade);
courseList[work[1]].honorPoints =
getHonorPoints(courseList[work[1]].grade);
//alert("honorPoints==" + courseList[work[1]].honorPoints);
courseList[work[1]].gradePoints =
format(getGradePoints(courseList[work[1]].credits,
courseList[work[1]].honorPoints), 1);
//alert("gradePoints==" + courseList[work[1]].gradePoints);

var formElements = document.GPAForm.elements;
for (var i = 0; i < formElements.length; i++) {

alert ("element name " +
document.GPAForm.elements.name + "
element index " + i); // problem is here!!!!

if (form.elements == null) {
alert("index=" + i + " I am null");
}

if (document.GPAForm.elements.name ==
(honorPointsPrefix +
work[1])) {
document.GPAForm.elements.value =
courseList[work[1]].honorPoints;
}
if (document.GPAForm.elements.name ==
(gradePointsPrefix +
work[1])) {
document.GPAForm.elements.value =
courseList[work[1]].gradePoints;
}
}
// form.reset();
showResult(document.GPAForm);
}

function showTable(form) {
if (form.showAll.checked) {
prev_sem_expolrer.style.visibility="visible";
} else {
prev_sem_expolrer.style.visibility="hidden";
}
}

function checkBrowser(string)
{
place = navigator.userAgent.toLowerCase().indexOf(string) + 1;
thestring = string;
return place;
}


courseList[0] = new course ("CASCH131", "4.0","A","20053","FALL
04","!title!");
courseList[1] = new course ("CASMA123", "4.0","A","20053","FALL
04","!title!");
courseList[2] = new course ("CASWR100", "4.0","B+","20053","FALL
04","!title!");
courseList[3] = new course ("ENGEK126", "4.0","A","20053","FALL
04","!title!");
courseList[4] = new course ("CASCH102", "4.0","A","20054","SPRG
05","!title!");
courseList[5] = new course ("CASLN212", "4.0","A","20054","SPRG
05","!title!");
courseList[6] = new course ("CASMA124", "4.0","A","20054","SPRG
05","!title!");
courseList[7] = new course ("CASPY211", "4.0","","20054","SPRG
05","!title!");
courseList[8] = new course ("CASPY211", "4.0","A","20054","SPRG
05","!title!");
courseList[9] = new course ("ENGEK130", "4.0","A","20054","SPRG
05","!title!");
courseList[10] = new course ("CASAR100", "4.0","A-","20063","FALL
05","!title!");
courseList[11] = new course ("CASEC101", "4.0","B+","20063","FALL
05","!title!");
courseList[12] = new course ("CASMA225", "4.0","A","20063","FALL
05","!title!");
courseList[13] = new course ("CASPY212", "4.0","A","20063","FALL
05","!title!");
courseList[14] = new course ("ENGEK301", "4.0","A-","20063","FALL
05","!title!");
courseList[15] = new course ("ENGAM310", "4.0","","20064","SPRG
06","!title!");
courseList[16] = new course ("ENGDR999", "16.0","","20064","SPRG
06","!title!");
courseList[17] = new course ("ENGEK156", "2.0","","20064","SPRG
06","!title!");
courseList[18] = new course ("PDPAQ101", "1.0","","20064","SPRG
06","!title!");
courseList[19] = new course ("SMGAC221", "4.0","","20064","SPRG
06","!title!");
courseList[20] = new course ("SMGAC222", "4.0","","20064","SPRG
06","!title!");
courseList[21] = new course ("ENGSC311", "4.0","","20071","SUM1
06","!title!");

var currentSemesterCode = "20073";
var currentSemesterName = fullSemesterName("20073");

</SCRIPT>
</HEAD>

<BODY BGCOLOR=#FFFFFF LINK=#CC0000 TEXT=#330000 VLINK=#CC0000
ALINK=#FF0000 onLoad="isJGrade();showResult(document.forms[0])">

<TABLE WIDTH=100% CELLSPACING=0 CELLPADDING=0>
<TR>

<TD><FONT SIZE=+1 COLOR=#660000 FACE="Verdana, Helvetica, Arial,
sans-serif"><B>GPA ESTIMATOR</B></FONT>
<TD ALIGN=right>
</TABLE>
<HR>
<TABLE ALIGN="center" BORDER=2 CELLSPACING=0 CELLPADDING=0
WIDTH="100%">
<TR ALIGN="center">
<TD>This calculation tool is an unofficial representation for
use in
estimating semester grade point averages. Some values may vary slightly
due to the script language limitations.
</TABLE>
<BR>
<BR>
<!--
<TABLE CELLSPACING=0 CELLPADDING=0>
<TR>
<TH>Semester:
<TD>
<SCRIPT LANGUAGE="JavaScript">
document.write(fullSemesterName("20073"));
</SCRIPT>
</TABLE>
-->
<TABLE ALIGN='center' CELLSPACING=0 CELLPADDING=0>
<TR>

<TD><B>Current semester courses and previous semesters' courses with
grades</B></TD>
</TR>
<TR>
<TD><B>'X', 'MG', 'I', and 'No grade'.</B></TD>
</TR>
</TABLE>

<FORM name="GPAForm">
<SCRIPT LANGUAGE="JavaScript">
document.write(assembleTable(currentSemesterCode));
document.close();
</SCRIPT>
<BR>
<BR>
<TABLE ALIGN='center' BORDER=0>

<TR><TH></TH><TH>Grade Points</TH>
<TH>GPA Based Credits</TH>
<TH>Estimated GPI/GPA</TH>
<TH>Estimated Earned Credits</TH></TR>
<TR>
<TD><STRONG>Current Semester<STRONG></TD>
<TD><INPUT TYPE='text' NAME='currentGradePoints' SIZE=10
DISABLED
onFocus=''></TD>
<TD><INPUT TYPE='text' NAME='currentCredits' SIZE=10 DISABLED
onFocus=''></TD>
<TD><INPUT TYPE='text' NAME='currentGpa' SIZE=10 DISABLED
onFocus=''></TD>

<TD><INPUT TYPE='text' NAME='currentEarnedCredits' SIZE=10
DISABLED
onFocus=''></TD>
</TR>
<TR>
<TD><STRONG>University(cumulative)</STRONG></TD>
<TD><INPUT TYPE='text' NAME='totalGradePoints' SIZE=10 DISABLED
onFocus=''></TD>
<TD><INPUT TYPE='text' NAME='totalCredits' SIZE=10 DISABLED
onFocus=''></TD>
<TD><INPUT TYPE='text' NAME='gpa' SIZE=10 DISABLED
onFocus=''></TD>
<TD><INPUT TYPE='text' NAME='totalEarnedCredits' SIZE=10
DISABLED
onFocus=''></TD>
</TR>
</TABLE>

<BR>
<BR>
<INPUT TYPE="checkbox" NAME="showAll"
onClick="showTable(this.form)"><STRONG> Show Previous
Semesters</STRONG>
</FORM>
<div id=prev_sem_expolrer style="visibility:hidden">
<h3 ALIGN='center'> Previous Semesters</I></h3>
<SCRIPT LANGUAGE="JavaScript">
document.write(assembleTablePrevious(currentSemesterCode));
</SCRIPT>
</div>
</BODY>
</HTML>
 
R

RobG

Hi,

I have a table with dynamic html that contains drop down select lists
and readonly text boxes. Dynamic calculations are done on change of a
value in one of the drop down select lists.

Using Safari,my first iteration the script works fine ( indicating that
there
are 33 form variables ). When trying another dropdown select value, the

form elements.length is shown as 33 ( as about ) BUT the script then
crashes with a 'null value' error. I cannot access any of the form
variables - this works in all other browsers and platforms.


Anyway ideas would be great appreciated...

1. Reduce the code to a minimum that displays the issue.

2. Manually wrap code at about 70 characters to avoid auto-wrapping
(particularly when you have many, many long string literals).

3. Use 2 spaces for indenting.

4. Ensure posted code will work as intended when copied and
pasted from a news reader.

5. Consider posting a link to a page rather than several hundred
lines of code.
 
R

RobG

Hi,

I have a table with dynamic html that contains drop down select lists
and readonly text boxes. Dynamic calculations are done on change of a
value in one of the drop down select lists.

Using Safari,my first iteration the script works fine ( indicating that
there
are 33 form variables ). When trying another dropdown select value, the

form elements.length is shown as 33 ( as about ) BUT the script then
crashes with a 'null value' error. I cannot access any of the form
variables - this works in all other browsers and platforms.


Anyway ideas would be great appreciated...

1. Reduce the code to a minimum that displays the issue.

2. Manually wrap code at about 70 characters to avoid auto-wrapping
(particularly when you have many, many long string literals).

3. Use 2 spaces for indenting.

4. Ensure posted code will work as intended when copied and
pasted from a news reader.

5. Consider posting a link to a page rather than several hundred
lines of code.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,770
Messages
2,569,583
Members
45,074
Latest member
StanleyFra

Latest Threads

Top