Working JS to show weighted total as scores are entered
This commit is contained in:
parent
e7fa4945d3
commit
08bed04047
|
|
@ -21,6 +21,7 @@
|
||||||
<p>{{ $subscore->name }}<span class="text-xs text-gray-500 pl-2">Max: {{ $subscore->max_score }}</span></p>
|
<p>{{ $subscore->name }}<span class="text-xs text-gray-500 pl-2">Max: {{ $subscore->max_score }}</span></p>
|
||||||
</x-table.th>
|
</x-table.th>
|
||||||
@endforeach
|
@endforeach
|
||||||
|
<x-table.th>Total</x-table.th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<x-table.body :sortable="false">
|
<x-table.body :sortable="false">
|
||||||
|
|
@ -35,11 +36,15 @@
|
||||||
name="judge{{ $judge->id }}[{{ $subscore->id }}]"
|
name="judge{{ $judge->id }}[{{ $subscore->id }}]"
|
||||||
class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6 judge{{$judge->id}}score"
|
class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6 judge{{$judge->id}}score"
|
||||||
@if($oldScores) value="{{ $oldScores['judge'.$judge->id][$subscore->id] }}" @endif
|
@if($oldScores) value="{{ $oldScores['judge'.$judge->id][$subscore->id] }}" @endif
|
||||||
required >
|
required
|
||||||
|
{{-- onchange="judge{{$judge->id}}sum()"--}}
|
||||||
|
>
|
||||||
</x-table.td>
|
</x-table.td>
|
||||||
@endforeach
|
@endforeach
|
||||||
<x-table.td id="judge{{ $judge->id }}total" x-text="total">
|
<x-table.td >
|
||||||
|
<p id="judge{{ $judge->id }}total" class="pr-3">
|
||||||
|
0.000
|
||||||
|
</p>
|
||||||
</x-table.td>
|
</x-table.td>
|
||||||
</tr>
|
</tr>
|
||||||
@endforeach
|
@endforeach
|
||||||
|
|
@ -51,4 +56,28 @@
|
||||||
</x-form.form>
|
</x-form.form>
|
||||||
|
|
||||||
</x-card.card>
|
</x-card.card>
|
||||||
|
<script>
|
||||||
|
function calculateTotal(judgeId) {
|
||||||
|
let total = 0;
|
||||||
|
let totalWeights = 0;
|
||||||
|
let thisSubscore
|
||||||
|
@foreach($subscores as $subscore)
|
||||||
|
thisSubscore = parseFloat(document.getElementById("j" + judgeId + "ss{{ $subscore->id }}").value) * {{ $subscore->weight }};
|
||||||
|
if (!isNaN(thisSubscore)) {
|
||||||
|
total += thisSubscore;
|
||||||
|
}
|
||||||
|
totalWeights += {{ $subscore->weight }};
|
||||||
|
@endforeach
|
||||||
|
let finalTotal = (total / totalWeights).toFixed(3);
|
||||||
|
document.getElementById('judge' + judgeId + 'total').innerHTML = finalTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@foreach($judges as $judge)
|
||||||
|
document.querySelectorAll('.judge' + {{ $judge->id }} + 'score').forEach(function(el) {
|
||||||
|
el.addEventListener('change', function() {
|
||||||
|
calculateTotal({{ $judge->id }});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
@endforeach
|
||||||
|
</script>
|
||||||
</x-layout.app>
|
</x-layout.app>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue