Fehlzeitenermittlung


Aufgabe A) Analysieren Sie das folgende Programm!

  • Was tut es?
  • Was kann es?
<!DOCTYPE html>
<html>
 
<head>
 
  <title>Fehlzeitenermittlung</title>
  <meta charset="UTF-8">
 
  <style type="text/css">
 
    body
    {
      background-color: orange;
      font-family:      arial, sans-serif;
    }
 
    span
    {
      display:          block;
      width:            100px;
      height:           70px;
      background-color: lightgrey;
      border:           2px solid red;
      padding:          3px;
      margin:           3px;
    }
 
  </style>
 
 
  <script type="text/javascript">
 
    var versp     = 0;
    var entsch    = 0;
    var unentsch  = 0;
    var tentsch   = 0;
    var tunentsch = 0;
    var tage      = 75;
 
    function schultage(number)
    {
      tage=tage+number;
      ausgabe();
    }
 
    function verspaetet()
    {
      versp++;
      ausgabe();
    }
 
    function sgefehlt(unentschuldigt)
    {
      entsch++;
      if( unentschuldigt ) unentsch++;
      ausgabe();
    }
 
    function tgefehlt(unentschuldigt)
    {
      tentsch++;
      if( unentschuldigt==true ) tunentsch++;
      ausgabe();
    }
 
    function ausgabe()
    {
      document.getElementById("textausgabe"). innerHTML=
        "An " + tage + " Tagen wurden folgende Fehlzeiten festgestellt:<p>" +
        "Tage gefehlt: "            + tentsch   + "<br>" +
        "Tage unentschuldigt: "     + tunentsch + "<br>" +
        "Stunden gefehlt: "         + entsch    + "<br>" +
        "Stunden unentschuldigt: "  + unentsch  + "<br>" +
        "Verspätungen: "            + versp     + "<br>" +
        "Tage prozentual abwesend: " + tageabwesendprozent() +
        "%, davon " + tageabwesendunentschprozent() + "% unentschuldigt.";
    }
 
    function tageabwesendprozent()
    {
      return (tentsch/tage*100).toFixed(0);
    }
 
    function tageabwesendunentschprozent()
    {
      return (tunentsch/tage*100).toFixed(0);
    }
 
  </script>
 
</head>
 
 
<body>
 
  <h1>Fehlzeiten</h1>
 
  <form name="fehl">
    Klasse: <input type="text" placeholder="MEA53">
    Name:   <input type="text" placeholder="Max Mustermann">
    Fach:   <input type="text" placeholder="WT">
  </form>
  <p>
 
  <table>
 
    <tr hidden>
 
      <td>
         <span onclick="schultage(1)">Ein weiterer Schultag</span>
      </td>
 
      <td>
         <span onclick="schultage(5)" hidden>Fünf weitere Schultage</span>
      </td>
 
        <td>
         <span onclick="schultage(7)" hidden>Sieben weitere Schultage</span>
      </td>
 
      <td>
      </td>
 
      <td>
      </td>
 
    </tr>
 
    <tr>
 
      <td>
        <span onclick="tgefehlt(false)">Tag entschuldigt gefehlt</span>
      </td>
 
      <td>
        <span onclick="tgefehlt(true)">Tag unentschuldigt gefehlt</span>
      </td>
 
      <td>
        <span onclick="sgefehlt(false)">Stunde entschuldigt gefehlt</span>
      </td>
 
      <td>
        <span onclick="sgefehlt(true)">Stunde unentschuldigt gefehlt</span>
      </td>
 
      <td>
        <span onclick="verspaetet()">Verspätet</span>
      </td>
 
    </tr>
 
  </table>
 
  <div id="textausgabe"></div>
 
</body>
 
</html>
 

Aufgabe B) Wie kann man das Programm verbessern?

  • Was müsste man ändern?
  • Wie könnte man es weiterentwickeln?

Ein paar Ideen:
  • Die Anzahl der Schultage des Halbjahres sollte eingebbar sein in einem Textfeld (unterschiedlich bei Berufsschülern und Vollzeitschülern).
  • Die Klasse sollte ausgewählt werden können in einer Auswahlliste.
    Klasse:
    <select name="klasse" id="klasse" size="1">
      <script type="text/javascript">
        for(var i=0; i<klassen.length; i++)
          document.write( "<option value='"+ klassen[i] +"'>" + klassen[i] + "</option>" );
      </script>
    </select>
  • Die Namen der SchülerInnen sollten in einer automatisch generierten Auswahlliste verwendet werden.
    • Dafür nutzt man am besten ein Array mit den Namen der SchülerInnen.
      var klassen   = new Array("MEA41", "MEA42", "MEA43");
  • ...

Aufgabe C) Verbessern Sie das Programm entsprechend der gesammelten Anregungen und Ideen!