Almost there

roughage/templates/roughage/nutrition_calibration.html

+{% extends "base.html" %}
+{% comment %}
+#
+# Copyright (c) 2020 NIBIO <http://www.nibio.no/>. 
+# 
+# This file is part of VIPSWeb.
+# VIPSWeb is free software: you can redistribute it and/or modify
+# it under the terms of the NIBIO Open Source License as published by 
+# NIBIO, either version 1 of the License, or (at your option) any
+# later version.
+# 
+# VIPSWeb is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# NIBIO Open Source License for more details.
+#
+# You should have received a copy of the NIBIO Open Source License
+# along with VIPSWeb.  If not, see <http://www.nibio.no/licenses/>.
+# 
+# @author: Tor-Einar Skog
+{% endcomment %}
+{% load i18n l10n staticfiles template_helper %}
+{% block title%}{% trans "Roughage nutrition model" %}{%endblock%}
+{% block content %}
+<div class="singleBlockContainer">
+<h1>{% trans "Helper table for calculating MSC in" %} {% if ryegrass %}{% trans "ryegrass" %}{% else %}{% trans "Timothy-grass" %}{% endif %}</h1>
+<p>TODO: Description</p>
+<table id="MSCtable" class="table">
+    <tr class="heading">
+        <td style="font-weight:bold;">Kode</td>
+        <td style="font-weight:bold;">Numerisk indeks</td>
+        <td style="font-weight:bold;">Pr&oslash;ve (Antall skudd)</td>
+        <td style="font-weight:bold;">Numerisk verdi</td>
+    </tr>
+    {% for row in grass_table  %}
+    <tr>
+        <td>{{ row.0 }}</td>
+        <td id="index_{{forloop.counter0}}">{{ row.1 }}</td>
+        <td><input type="text" class="form-control" name="result_{{forloop.counter0}}" size="3" onchange="recalculate();"/></td>
+        <td id="value_{{forloop.counter0}}"></td>
+    </tr>
+    {% endfor %}
+    <tr style="background-color: #dddddd;">
+        <td style="font-weight:bold;">Sum</td>
+        <td></td>
+        <td style="font-weight:bold;" id="resultSum"></td>
+        <td style="font-weight:bold;" id="valueSum"></td>
+    </tr>
+    <tr style="background-color: #dddddd;">
+        <td colspan="3" style="font-weight:bold; font-size:large;">Numerisk utviklingstrinn (MSC) =</td>
+        <td id="MSCvalue" style="font-weight:bold; font-size:large;"></td>
+    </tr>
+</table>
+{% endblock %}
+{% block customJS %}
+<script type="text/javascript">
+	function recalculate()
+	{
+		var MSCtable=document.getElementById("MSCtable");
+		var inputFields = MSCtable.getElementsByTagName("input");
+		var resultSum = 0;
+		var valueSum = 0;
+		for(var i=0;i<inputFields.length;i++)
+		{
+			if(inputFields[i].value.length > 0)
+			{
+				var result = Number(inputFields[i].value);
+				if(isNaN(result))
+				{
+					inputFields[i].value = "";
+					result=0;
+				}
+				var order = inputFields[i].name.split("_")[1];
+				var value = Number(document.getElementById("index_" + order).innerHTML) * result;;
+				var valueField = document.getElementById("value_" + order);
+				valueField.innerHTML=value.toFixed(2);
+				resultSum += result;
+				valueSum += value;
+			}
+			else
+			{
+				var order = inputFields[i].name.split("_")[1];
+				var valueField = document.getElementById("value_" + order);
+				valueField.innerHTML="0";
+			}
+		}
+		document.getElementById("resultSum").innerHTML = resultSum;
+		document.getElementById("valueSum").innerHTML = valueSum.toFixed(2);
+		var MSCvalue = valueSum / resultSum;
+		document.getElementById("MSCvalue").innerHTML = !isNaN(MSCvalue) ? MSCvalue.toFixed(2) : "0.00";
+	}
+</script>
+{% endblock %}
+{% block customCSS %}
+
+{% endblock %}
\ No newline at end of file

roughage/urls.py

@@ -21,5 +21,6 @@ from django.conf.urls import url
 from roughage import views
 
 urlpatterns = [
+    url(r'^nutrition/calibration/$', views.nutrition_calibration),
     url(r'^nutrition/$', views.nutrition)
 ]
\ No newline at end of file

roughage/views.py

@@ -22,3 +22,45 @@ from django.shortcuts import render
 def nutrition(request):
     context = { "form_id" : "roughageNutrition"}
     return render(request, "roughage/nutrition.html", context)
+
+def nutrition_calibration(request):
+    timothy_table = [
+        ["V0","1.000"],
+        ["V1","1.070"],
+        ["V2","1.230"],
+        ["V3","1.400"],
+        ["V4","1.570"],
+        ["V5","1.730"],
+        ["V6","1.900"],
+        ["E1","2.150"],
+        ["E2","2.400"],
+        ["E3","2.650"],
+        ["E4","2.900"],
+        ["R0","3.000"],
+        ["R1","3.100"],
+        ["R2","3.300"],
+        ["R3","3.500"],
+        ["R4","3.700"]
+    ]
+    ryegrass_table = [
+        ["V0","1.000"],
+        ["V1","1.230"],
+        ["V2","1.570"],
+        ["V3","1.900"],
+        ["E0","2.000"],
+        ["E1","2.230"],
+        ["E2","2.570"],
+        ["E3","2.900"],
+        ["R0","3.000"],
+        ["R1","3.100"],
+        ["R2","3.300"],
+        ["R3","3.500"]
+    ]
+    
+    ryegrass = True if request.GET.get("grastype", None) != None and request.GET["grastype"] == "raigras" else False
+    
+    context = {
+        "ryegrass": ryegrass,
+        "grass_table" : ryegrass_table if ryegrass else timothy_table
+        }
+    return render(request, "roughage/nutrition_calibration.html", context)