www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 18

Thread: Dying to solve this...Please help

  1. #1
    Join Date
    Jan 2013
    Posts
    9

    Smile Dying to solve this...Please help

    Write a web page that allows to calculate the grades for 3 courses as well as the GPA for them.

    Your page must display 3 divisions laid out vertically near each other sharing the page width of 900 px.
    Each division displays form elements to enter the grades of that course. Grades are entered as follows:
    o # of Credits
    o Exam 1 - 20%
    o Exam 2 - 20%
    o Project 1 - 15%
    o Project 2 - 15%
    o Final Exam - 30%
    The division also displays two empty span tags (not empty form cells) that will show the average grade of the course and the letter grade of the course once calculated as described below.

    The four division are followed (beneath them) by another division that displays the following:
    o GPA of the 3 courses
    o A button labelled 'Calculate'
    o A button labelled 'Clear'
    When the CALCULATE button is clicked, a javascript program must calculate the average of each class and its letter grade. The results should be displayed in the empty span tags mentioned above below each course. It then calculates the average GPA of the 3 courses and displays it in a BOLD CLEAR LARGE text below the forms (above the buttons).

    When the CLEAR button is clicked, all form elements should become empty.

  2. #2
    Join Date
    Jul 2003
    Location
    The City of Roses
    Posts
    2,503
    Smells like homework.
    for(split(//,'))*))91:+9.*4:1A1+9,1))2*:..)))2*:31.-1)4131)1))2*:3)"'))
    {for(ord){$i+=$_&7;grep(vec($s,$i++,1)=1,1..($_>>3)-4);}}print"$s\n";

  3. #3
    Join Date
    Jan 2013
    Posts
    9
    Please help me with this. I have to present this to my professor before Wednesday. This is life-threatening and I won't take my degree if I did not solve.

    This has to be solved by Javascript. I need to create three types of courses vertically aligned and under each course I have to insert info: credit hours, exam 1, exam 2, exam 3 etc.
    and then click on calculate to get my GPA for the 3 courses and the letter grade for each course after we do the percentages mentioned in my first thread.

    Please help and I will help in return with many other stuff..

    Regards

  4. #4
    Join Date
    Jan 2013
    Posts
    10
    Edward, what do you have so far?

    If you are a degree seeking student then you must have some knowledge of how to approach this problem.

  5. #5
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,377

    Question

    Wednesday is only 2 days away. Are we dead yet?
    What have you done to avoid the inevitable that does not involve paying taxes?
    Any sample code yet?

  6. #6
    Join Date
    Jan 2013
    Posts
    9

    so far I have this...

    So far I have finished the design part. I mean my xhtml and css parts, the forms and classes and buttons...
    I still have to write the functions...one function that give me gpa, another for letter grade etc.
    I will copy paste what I have so far as soon as I login to my laptop...
    And it's not an issue of knowing. It's an issue of time, work, and million of worries...that's why I'm going blank.
    Please help
    Thank you

  7. #7
    Join Date
    Jan 2013
    Posts
    9
    This is what I have so far...I still need to do the function so that the process works...the functions must contain the percentages I mentioned above for exam1, exam2, etc. I have to get the final grade for "each course", the "letter Grade" for each course, and the the GPA for all the courses. 3 courses

    <?xml version = "1.0"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



    <html xmlns = "http://www.w3.org/1999/xhtml">
    <head>
    <title>Class Average Program</title>
    <style type="text/css">
    .centerBody {
    position:relative;
    margin:0 auto;
    width:900px;
    height:100%;
    display: inline-block;
    text-align: center;
    }
    .centerForm {
    position:relative;
    width:100%;
    height:100%;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    display: inline-block;
    text-align: center;


    }
    .formRow {
    margin-left: 25%;
    margin-right:25%;
    width: 100%;lock;
    position:relative;
    }
    .horizontalForm {
    width: 400px;
    position:relative;
    margin: 0 auto;

    }
    .lblForm {
    width: 100px;
    position:relative;
    display: inline-block;
    text-align: center;
    }
    </style>
    <script type = "text/javascript">

    </script>
    <body class="centerBody">
    <form name="form1" class="centerForm" action=''>
    <div class="formRow">
    <div class="centerForm">
    <div class="lblForm">
    <label>Credits:</label>
    </div>
    <input type='text' name='creditRow1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 1:</label>
    </div>
    <input type='text' name='ex1Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 2:</label>
    </div>
    <input type='text' name='ex2Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 1:</label>
    </div>
    <input type='text' name='pr1Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 2:</label>
    </div>
    <input type='text' name='pr2Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Final Exam:</label>
    </div>
    <input type='text' name='finalRow1' size='5' maxlength='5'/>
    </div>
    </div>
    <div class="formRow">
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Credits:</label>
    </div>
    <input type='text' name='creditRow2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 1:</label>
    </div>
    <input type='text' name='ex1Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 2:</label>
    </div>
    <input type='text' name='ex2Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 1:</label>
    </div>
    <input type='text' name='pr1Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label>Project 2:</label>
    </div>
    <input type='text' name='pr2Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Final Exam:</label>
    </div>
    <input type='text' name='finalRow2' size='5' maxlength='5'/>
    </div>
    </div>
    <div class="formRow">
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Credits:</label>
    </div>
    <input type='text' name='creditRow3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 1:</label>
    </div>
    <input type='text' name='ex1Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 2:</label>
    </div>
    <input type='text' name='ex2Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 1:</label>
    </div>
    <input type='text' name='pr1Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 2:</label>
    </div>
    <input type='text' name='pr2Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Final Exam:</label>
    </div>
    <input type='text' name='finalRow3' size='5' maxlength='5'/>
    </div>
    </div>
    <div class="formRow">
    <div class="horizontalForm">
    <input type="button" value="Calculate" name="calcBtn" onclick="cumCalc()"/>
    <input type="button" value="Clear" name="clearBtn" onclick="clear()"/>
    </div>
    </div>
    </form>
    </body>
    </html>

  8. #8
    Join Date
    Jan 2013
    Posts
    9

    This is what I have so far

    <?xml version = "1.0"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



    <html xmlns = "http://www.w3.org/1999/xhtml">
    <head>
    <title>Class Average Program</title>
    <style type="text/css">
    .centerBody {
    position:relative;
    margin:0 auto;
    width:900px;
    height:100%;
    display: inline-block;
    text-align: center;
    }
    .centerForm {
    position:relative;
    width:100%;
    height:100%;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    display: inline-block;
    text-align: center;


    }
    .formRow {
    margin-left: 25%;
    margin-right:25%;
    width: 100%;lock;
    position:relative;
    }
    .horizontalForm {
    width: 400px;
    position:relative;
    margin: 0 auto;

    }
    .lblForm {
    width: 100px;
    position:relative;
    display: inline-block;
    text-align: center;
    }
    </style>
    <script type = "text/javascript">

    </script>
    <body class="centerBody">
    <form name="form1" class="centerForm" action=''>
    <div class="formRow">
    <div class="centerForm">
    <div class="lblForm">
    <label>Credits:</label>
    </div>
    <input type='text' name='creditRow1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 1:</label>
    </div>
    <input type='text' name='ex1Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 2:</label>
    </div>
    <input type='text' name='ex2Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 1:</label>
    </div>
    <input type='text' name='pr1Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 2:</label>
    </div>
    <input type='text' name='pr2Row1' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Final Exam:</label>
    </div>
    <input type='text' name='finalRow1' size='5' maxlength='5'/>
    </div>
    </div>
    <div class="formRow">
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Credits:</label>
    </div>
    <input type='text' name='creditRow2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 1:</label>
    </div>
    <input type='text' name='ex1Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 2:</label>
    </div>
    <input type='text' name='ex2Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 1:</label>
    </div>
    <input type='text' name='pr1Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label>Project 2:</label>
    </div>
    <input type='text' name='pr2Row2' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Final Exam:</label>
    </div>
    <input type='text' name='finalRow2' size='5' maxlength='5'/>
    </div>
    </div>
    <div class="formRow">
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Credits:</label>
    </div>
    <input type='text' name='creditRow3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 1:</label>
    </div>
    <input type='text' name='ex1Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Exam 2:</label>
    </div>
    <input type='text' name='ex2Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 1:</label>
    </div>
    <input type='text' name='pr1Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Project 2:</label>
    </div>
    <input type='text' name='pr2Row3' size='5' maxlength='5'/>
    </div>
    <div class="centerForm">
    <div class="lblForm">
    <label class="lblForm">Final Exam:</label>
    </div>
    <input type='text' name='finalRow3' size='5' maxlength='5'/>
    </div>
    </div>
    <div class="formRow">
    <div class="horizontalForm">
    <input type="button" value="Calculate" name="calcBtn" onclick="cumCalc()"/>
    <input type="button" value="Clear" name="clearBtn" onclick="clear()"/>
    </div>
    </div>
    </form>
    </body>
    </html>

  9. #9
    Join Date
    Jan 2013
    Posts
    9
    Please help guys, I'm not lying nor faking anything. This is really important to me. The most important thing in my life now.
    Thank You for understanding
    Regards

  10. #10
    Join Date
    Dec 2012
    Location
    NSW Australia
    Posts
    73
    I like your life threatening professor.


    How about giving us some sample data that could be put into each text box and what you would you expect the calculate button to do...

    clearly showing the steps...

  11. #11
    Join Date
    Jan 2013
    Posts
    9
    Dear friend,
    You can use any data you want...credits can be 3 or 4 or 1 etc.
    The calculate button should be able to show the grade of each course in an empty span tag under each course and letter grade also in an empty span tag under each course, so we should have 6 span tag...and under them one GPA box that also calculates the gpa of all courses...so the button calculate does all of this...the gpa must show above the buttons in a clear bold text...please help I'm out of time...tomorrow deadline
    Thank youuuu

  12. #12
    Join Date
    Jan 2013
    Posts
    9

    no specific data...anything

    Dear friend,
    You can use any data you want...credits can be 3 or 4 or 1 etc.
    Any grades will also suffice...but has to be according to the rates given...for example if the grade is 80 on exam 1 then 80x0.20 equals...
    The calculate button should be able to show the grade of each course in an empty span tag under each course and letter grade also in an empty span tag under each course, so we should have 6 span tag...and under them one GPA box that also calculates the gpa of all courses...so the button calculate does all of this...the gpa must show above the buttons in a clear bold text...please help I'm out of time...tomorrow deadline
    Thank youuuu

  13. #13
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,377

    Lightbulb

    You have a bunch of redundant code. You were also missing some closing tags ( </head> for example).
    I compressed some of script to give the same look, but easier to read the code groupings.

    I added a clearForm() function. You should be able to modify it to perform your calculations.
    Let's see what you can do with it.

    Also, it is a good idea to surround you script between [ code] and [ /code] tags (without the spaces)
    to make it easier for forum members to read, copy and test your code.
    Code:
    <?xml version = "1.0"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns = "http://www.w3.org/1999/xhtml">
    <head>
    <title>Class Average Program</title>
    <style type="text/css">
    .centerBody {
     position:relative;
     margin:0 auto;
     width:900px;
     height:100%;
     display: inline-block;
     text-align: center;
    }
    .centerForm {
     position:relative;
     width:100%;
     height:100%;
     margin-left: 10px;
     margin-right: 10px;
     margin-top: 10px;
     margin-bottom: 10px;
     display: inline-block;
     text-align: center;
    }
    .formRow {
     margin-left: 25%;
     margin-right:25%;
     width: 100%;lock;
     position:relative;
    }
    .horizontalForm {
     width: 400px;
     position:relative;
     margin: 0 auto;
    }
    .lblForm {
     width: 100px;
     position:relative;
     display: inline-block;
     text-align: center;
    }
    </style>
    </head>
    <body class="centerBody">
    <form name="form1" class="centerForm" action='' onsubmit="return false">
     <div id="Semester" class="formRow">
      <div id="Course1" class="centerForm">
       <div class="lblForm"> <label>Credits:</label> </div>
       <input type='text' name='creditRow1' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Exam 1:</label> </div>
       <input type='text' name='ex1Row1' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Exam 2:</label> </div>
       <input type='text' name='ex2Row1' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Project 1:</label> </div>
       <input type='text' name='pr1Row1' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Project 2:</label> </div>
       <input type='text' name='pr2Row1' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Final Exam:</label> </div>
       <input type='text' name='finalRow1' size='5' maxlength='5'/> <br>
      </div>
      <div id="Course2" class="centerForm">
       <div class="lblForm"> <label class="lblForm">Credits:</label> </div>
       <input type='text' name='creditRow2' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Exam 1:</label> </div>
       <input type='text' name='ex1Row2' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Exam 2:</label> </div>
       <input type='text' name='ex2Row2' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Project 1:</label> </div>
       <input type='text' name='pr1Row2' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label>Project 2:</label> </div>
       <input type='text' name='pr2Row2' size='5' maxlength='5'/>    <p>
       <div class="lblForm"> <label class="lblForm">Final Exam:</label> </div>
       <input type='text' name='finalRow2' size='5' maxlength='5'/>    <br>
      </div>
      <div id="Course3" class="centerForm">
       <div class="lblForm"> <label class="lblForm">Credits:</label>  </div>
       <input type='text' name='creditRow3' size='5' maxlength='5'/>   <p>
       <div class="lblForm"> <label class="lblForm">Exam 1:</label> </div>
       <input type='text' name='ex1Row3' size='5' maxlength='5'/>   <p>
       <div class="lblForm"> <label class="lblForm">Exam 2:</label> </div>
       <input type='text' name='ex2Row3' size='5' maxlength='5'/>   <p>
       <div class="lblForm"> <label class="lblForm">Project 1:</label> </div>
       <input type='text' name='pr1Row3' size='5' maxlength='5'/>   <p>
       <div class="lblForm"> <label class="lblForm">Project 2:</label> </div>
       <input type='text' name='pr2Row3' size='5' maxlength='5'/>   <p>
       <div class="lblForm"> <label class="lblForm">Final Exam:</label> </div>
       <input type='text' name='finalRow3' size='5' maxlength='5'/> <br>
      </div>
      <div id="infoActions" class="centerForm">
       <div class="horizontalForm">
        <input type="button" value="Calculate" name="calcBtn" onclick="cumCalc()"/>
        <input type="button" value="Clear" name="clearBtn" onclick="clearForm()"/>
       </div>
      </div>
     </div>
    </form>
    
    <script type = "text/javascript">
    function cumCalc() {
      alert('cumCalc is not coded yet!');
    }
    function clearForm() {
      var str = '';
      var sel = document.getElementById('Semester').getElementsByTagName('input');
      for (var i=0; i<sel.length; i++) { sel[i].value = ''; }
    }
    </script>
    
    </body>
    </html>

  14. #14
    Join Date
    Dec 2012
    Location
    NSW Australia
    Posts
    73
    Quote Originally Posted by Edwardfaraj View Post
    You can use any data you want...credits can be 3 or 4 or 1 etc.
    Any grades will also suffice...but has to be according to the rates given...for example if the grade is 80 on exam 1 then 80x0.20 equals...
    The calculate button should be able to show the grade of each course in an empty span tag under each course and letter grade also in an empty span tag under each course, so we should have 6 span tag...and under them one GPA box that also calculates the gpa of all courses...so the button calculate does all of this...the gpa must show above the buttons in a clear bold text
    NO NO NO

    follow instructions
    step 1: YOU list actual values for each of the list boxes. proper values that anyone that will use your form will enter..

    step 2: hit the calculate button

    step 3: NOW you give a very detailed description of what to do with the values entered in step 1. How each value is used to get your results required. JUST the results NOT where to place them in your form.....


    The details in step three will be a step by step description that can be used by anyone to get the same result each time. Even when different values are entered in step 1 everyone will get the same result....

    If you cannot do that how can anyone (including yourself) write a JavaScript function.

    When you have done that SO IT WORKS each time you read through it, hand that step by step description in with your final work to your professor.


    May he look upon you with favour.

  15. #15
    Join Date
    Jan 2013
    Posts
    9

    My reply

    Dear friend,
    Thank you so much for your help I appreciate this so muchhh...

    The clear function has worked perfectly, but what I really want is that when I click calculate, a grade for each course to appear in an empty span tag box...And also a letter grade for each course...And then the GPA of all courses...

    So the calculate button must perform 3 tasks...grade for each course...letter grade for each course, and GPA for everything..

    You can perform the function based on A means 4.0, B 3.0, B+ 3.3, B- 2.7 etc....D 1.0 C 2.0...

    88 means A-...A means 92...80 means B...in other words, 80-82 B...70-72 C...60-62 D...you know the standard...

    Can you please help me further?

    Thank you for your help again...

    Edward

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles