Cara Membuat Perhitungan Nilai Rata-rata dengan Javascript -

Perhitungan sering kita jumpai pada sebuah website yang berbasis akuntasi nilai mahasiswa atau perhitungan lainya, memang tidak di pungkiri, perhitungan ini sering kita pakai, walaupun tidak semua website ya, oke untuk kasus kali ini kita akan mencoba mengihitung nilai rata-rata dari sebuah nilai mahasiswa, oke bagaimana cara membuat perhitungan nilai rata-rata dengan javascript, simak terus ya teman-teman.

cara membuat perhitungan nilai rata-rata dengan javascript, jadi silahkan teman-teman siapkan sebuah template dari sebuah bootstrap ya, cukup kita linkan saja CDN dari bootstrap supaya template kita jadi lebih rapih sedikit, jadi kasusnya disini saya membuat beberapa inputan dimana inputan itu akan kita masukan ke dalam satu array lalu nilai array itulah yang akan kita proses, dan hasilnya akan kita keluarkan di inputan sebelahnya kurang lebih seperti itu.

Pasti bertanya-tanya bagaimana caranya memasukan data dari inputan ke dalam array, disini saya membuatnya simple, dimana saya membuat sebuah variable dengan beberapa inputan dimana inputan itu sudah kita ambil valuenya, dan nama variable dari setiap inputan itu kita masukan ke dalam array, kurang lebih seperti itu.

Oke supaya lebih paham silahkan teman-teman copy saja kode berikut ini:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Javascript.</title>
<style>
	body {
		font-family: sans-serif;
		margin: 10%
	}
</style>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div class="container">
	<div class="row">
		<h1>Cara Membuat Perhitungan Nilai Rata-rata dengan Javascript</h1>
		<div class="col-md-6">
			
			<form>
				<div class="form-group">
				    <label>Pengantar Bisnis</label>
				    <input type="number" class="form-control" id="nilaiBisnis" step="0.01">
				 </div>
				 <div class="form-group">
				    <label>Pengantar Akuntansi I</label>
				    <input type="number" class="form-control" id="nilaiAkuntansi" step="0.01">
				 </div>
				 <div class="form-group">
				    <label>Pengantar Ekonomi Mikro</label>
				    <input type="number" class="form-control" id="nilaiMikro" step="0.01">
				 </div>
				 <div class="form-group">
				    <label>Matematika Ekonomi I</label>
				    <input type="number" class="form-control" id="nilaiMatematika" step="0.01">
				 </div>
				 <div class="form-group">
				    <label>Hukum dalam Bisnis</label>
				    <input type="number" class="form-control" id="nilaiDalamBis" step="0.01">
				 </div>
				 <button type="submit" class="btn btn-primary" id="cek">Cek Rata-rata</button>
			</form>
			
		</div>
		<div class="col-md-6">
			<div class="form-group">
			    <label>Hasil Rata-rata</label>
			    <input type="text" class="form-control" id="demo" disabled>
			</div>
		</div>			 
	</div>
</div>
<script>
	// Tulis disini
	var buttonCek = document.getElementById("cek");
	buttonCek.addEventListener("click", function cek(e){
		e.preventDefault()
		var nilaiBisnis =  document.getElementById("nilaiBisnis").value
		var nilaiAkuntansi =  document.getElementById("nilaiAkuntansi").value
		var nilaiMikro =  document.getElementById("nilaiMikro").value
		var nilaiMatematika =  document.getElementById("nilaiMatematika").value
		var nilaiDalamBis =  document.getElementById("nilaiDalamBis").value
		var ipSemester = [nilaiBisnis, nilaiAkuntansi, nilaiMikro, nilaiMatematika, nilaiDalamBis ]
		console.log(ipSemester)

		var total = 0;
		for(var i = 0; i<ipSemester.length; i++){
			total += parseFloat(ipSemester[i])
			var hasil = total / ipSemester.length;
		}
		document.getElementById("demo").value = hasil.toFixed(2)
		console.log("IP, Kumulatif "+ hasil.toFixed(2))

	})
</script>
</body>
</html>

<!DOCTYPE html>

<head>

<title>Javascript.</title>

<style>

body {

font-family: sans-serif;

margin: 10%

}

</style>

</head>

<body>

<h1>Cara Membuat Perhitungan Nilai Rata-rata dengan Javascript</h1>

<form>

<label>Pengantar Bisnis</label>

</div>

<label>Pengantar Akuntansi I</label>

</div>

<label>Pengantar Ekonomi Mikro</label>

</div>

<label>Matematika Ekonomi I</label>

</div>

<label>Hukum dalam Bisnis</label>

</div>

</form>

</div>

<label>Hasil Rata-rata</label>

</div>

// Tulis disini

var buttonCek = document.getElementById("cek");

buttonCek.addEventListener("click", function cek(e){

e.preventDefault()

var nilaiBisnis = document.getElementById("nilaiBisnis").value

var nilaiAkuntansi = document.getElementById("nilaiAkuntansi").value

var nilaiMikro = document.getElementById("nilaiMikro").value

var nilaiMatematika = document.getElementById("nilaiMatematika").value

var nilaiDalamBis = document.getElementById("nilaiDalamBis").value

var ipSemester = [nilaiBisnis, nilaiAkuntansi, nilaiMikro, nilaiMatematika, nilaiDalamBis ]

console.log(ipSemester)

var total = 0;

for(var i = 0; i<ipSemester.length; i++){

total += parseFloat(ipSemester[i])

var hasil = total / ipSemester.length;

}

document.getElementById("demo").value = hasil.toFixed(2)

console.log("IP, Kumulatif "+ hasil.toFixed(2))

})

</script>

</body>

</html>

Jika teman-teman sudah copy maka akan tampil hasil seperti ini:

Bisa dilihat saya memasukan beberapa angka dengan pecahan, dan nilai rata-ratanya akan tampak pada hasil di sampingnya, bagaimana cukup simple, oke saya rasa cukup sampai disini belajar kita tentang cara membuat perhitungan nilai rata-rata dengan javascript, semoga bermanfaat sampai jumpa pada artikel berikutnya terimakasih

Cara Membuat Perhitungan Nilai Rata-rata dengan Javascript

Facebook DUMET School

Categories