feeAmountProblem/Problem.html at master · athreyahn/feeAmountProblem · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script>
$(document).ready(function(){

	$('#nat').hide();
	$('#crs').hide();
	$('#lvl').hide();
	var json = $.parseJSON('{"Exam Fee" :{"INDIAN" :{"ALL_COURSES" :{"ALL_LEVEL" :{"amount" : 400}}},"FOREIGN" :{"ALL_COURSES" :{"ALL_LEVEL" :{"amount" : 100}}},"NRI" :{"ALL_COURSES" :{"ALL_LEVEL" :{"amount" : 600}}},"SAARC" :{"ALL_COURSES" :{"ALL_LEVEL" :{"amount" : 600}}}},"Application Fee" :{"INDIAN" :{"ALL_COURSES" :{"Double Degree": {"amount" : 450}, "UG": {"amount" : 200},"UGDIPLOMA":{"amount" : 300},"PG" :{"amount" : 500}}},"FOREIGN" :{"ALL_COURSES" :{"UG" :{"amount" : 400}, "Double Degree": {"amount": 670}, "UGDIPLOMA":{"amount" : 400},"PG" :{"amount" : 700}}}}}');
	var all_courses = ['Medical','Dental','Ayurveda'];
	var all_levels = ['UG','UG-DIPLOMA','PG','P.hD', 'Double Degree'];

	$.each(json,function(fee,nat){
		$('#fee').append($('<option>').text(fee).attr('value',fee));
	});

	$('#fee').on('change',function(){

		$('#nat').show();

		json = json[$('#fee').val()];

		$.each(json,function(nat,crs){
			$('#nat').append($('<option>').text(nat).attr('value',nat));
		});
	});
	$('#nat').on('change',function(){

		$('#crs').show();

		json = json[$('#nat').val()];

		if(json['ALL_COURSES'])
			$.each(all_courses,function(i, crs){
				$('#crs').append($('<option>').text(crs).attr('value',crs));
			});
		else
			$.each(json,function(crs, lvl){
				$('#crs').append($('<option>').text(crs).attr('value',crs));
			});
	});
	$('#crs').on('change',function(){

		$('#lvl').show();

		if(json[$('#crs').val()])
			json = json[$('#crs').val()];

		else
			json = json['ALL_COURSES'];

		if(json['ALL_LEVEL'])
			$.each(all_levels,function(i, lvl){
				$('#lvl').append($('<option>').text(lvl).attr('value',lvl));
			});
		else
			$.each(json,function(lvl, amt){
				$('#lvl').append($('<option>').text(lvl).attr('value',lvl));
			});

	});
	$('#lvl').on('change',function(){

		if(json[$('#lvl').val()])
			json = json[$('#lvl').val()];

		else
			json = json['ALL_LEVEL'];

		$('#amt').text(json.amount);

	});

});
</script>
</head>
<body>
<select id = "fee"><option value="" disabled selected hidden>-select-</option>
</select>
<br/><br/>
<select id = "nat"><option value="" disabled selected hidden>-select-</option>
</select>
<br/><br/>
<select id = "crs"><option value="" disabled selected hidden>-select-</option>
</select>
<br/><br/>
<select id = "lvl"><option value="" disabled selected hidden>-select-</option>
</select>
<br/><br/>
<p id = "amt"></p>
</body>
</html>