iambasilk · August 11, 2020 05:40
diff --git a/magicksquare.html b/magicksquare.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <title>MAGIC SQUARE</title>
      <script type = "text/javascript"
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
        <style type="text/css">
            .values {
 			width: 50px;
 			height: 50px;
 			float: left;
 			background-color: yellow;
 			align-content: center;
            }
            .clear {
 			clear: both;
 		}
        </style>
 		<script type="text/javascript">
 	
 			$(document).ready(function () {

 				




 			$('#title').css({"color":"red", "background-color":"blue"});
 		    var result = $('#result');
 		    $('#result1').css({"color":"black", "background-color":"green","font-size": "180%"});
 		    $('#result2').css({"color":"black", "background-color":"red","font-size": "180%"});
 		    $('#result3').css({"color":"black", "background-color":"orange","font-size": "160%"});

 		        var size = 3;
 <!--		        result.html('');-->
 		   		//for loop to creating input field 3*3
 		        for (i = 0; i < size; i++) {
 		            for (j = 0; j < size; j++) {
 		                result.append('<input type="text" class="values"/>');
 		            }
 		            result.append('<div class="clear"></div>');
 		        }
 		        result.append('<button id="button_2">CHECK</button>');
 		        result.append('<div class="clear"></div>');
 		        $("#button_2").click(function () {
 		            var result3 = $('#result3');

 		    var values = $('.values');
 		    r = []
 		    for (k=0;k<9;k++){
 		        num1=parseInt(values.get(k).value);
 		            r.push(num1);
 		        }
 		        num=r[0]
 		        res=0;
 		        for(m=0;m<9;m++){
 		            num=r[m]
               for (k=m+1;k<9;k++){
                    if(num == r[k]){
                        res=1;
                        break;
                        }
                        }
                        }
               if(res==1){
            $("#result3").text("THERE IS A DUPLICATION..PLEASE AVOID IT AND TRY AGAIN!");
            }
 <!--            else{-->
 <!--            flag = 0;-->
 <!--            for (k=0;k<9;k++){-->
 <!--                    if(r[k] == ''){-->
 <!--                        flag=1;-->
 <!--                        break;-->
 <!--                        }-->
 <!--                        }-->
 <!--             if(flag==1){-->
 <!--            $("#result3").text("THERE IS A NULLFIELD..PLEASE FILL IT AND TRY AGAIN!");-->
 <!--            }-->
            else{


 		    var arr = [];
 		    for (i = 0; i < size; i++) {
 		        var innerarray = [];
 		        for (j = 0; j < size; j++) {
 		            num1=parseInt(values.get(i * size + j).value);
 		            innerarray.push(num1);
 		        }
 		        arr.push(innerarray);
 		    }


 		    //checking of magic square
 		    var magic = true;
 		    var magic_number = 0;
 		    var total = 0;

 		    //find the sum that makes the square magic
 		    for (c = 0; c < size; c++) {
 		        magic_number += arr[0][c];
 		    }
 		    //checking of every row total is equal or not the magic number
 		     for (r = 1; r < size; r++) {
 		        for (c = 0; c < size; c++) {
 		            total += arr[r][c];
 		        }
 		        if (total != magic_number)
 		        	magic = false;
 		        total = 0;
 		    }
 		    //checking of every column total is equal or not the magic number
 		    for (c = 0; c < size; c++) {
 		        for (r = 0; r < size; r++) {
 		            total += arr[r][c];
 		        }
 		        if (total != magic_number)
 		        	magic = false;
 		        total = 0;
 		    }
 		    //checking sum of the diagonals
 		   for (i = 0; i < size; i++) {
 		        total += arr[i][i];
 		    }
 		    if (total != magic_number)
 		    	magic = false;
 		    total = 0;

 		    for (i = 0; i < size; i++) {
 		        total += arr[i][size - i - 1];
 		    }
 		    if (total != magic_number) {
 		        magic = false;
 		    }
 		    total = 0;
 		    if (magic) {
 		        $("#result2").hide();
 		        $("#result3").hide();
 		        $("#result1").text("CONGRATS...IT'S A MAGIC SQUARE!");
 		    } else {
 		        $("#result1").hide();
 		        $("#result3").hide();
 		        $("#result2").text("OOPS...IT'S NOT A MAGIC SQUARE....TRY AGAIN!");
 		    }
 		    }
 		    });

 			//basil start

 				$(".values").click(function () {
 					console.log($(this).val());
 					$(this).val('');
 				});
 			
 			//basil end
 		});

 		

 	</script>
 </head>
 <body>
 <h1 id='title' >MAGIC SQUARE</h1>
 <p id="result"></p>
 <p id="result1"></p>
 <p id="result2"></p>
 <p id="result3"></p>
 </body>
 </html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<title>MAGIC SQUARE</title>
	<script type = "text/javascript"
	src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
	</script>
	<style type="text/css">
	.values {
	width: 50px;
	height: 50px;
	float: left;
	background-color: yellow;
	align-content: center;
	}
	.clear {
	clear: both;
	}
	</style>
	<script type="text/javascript">

	$(document).ready(function () {






	$('#title').css({"color":"red", "background-color":"blue"});
	var result = $('#result');
	$('#result1').css({"color":"black", "background-color":"green","font-size": "180%"});
	$('#result2').css({"color":"black", "background-color":"red","font-size": "180%"});
	$('#result3').css({"color":"black", "background-color":"orange","font-size": "160%"});

	var size = 3;
	<!-- result.html('');-->
	//for loop to creating input field 3*3
	for (i = 0; i < size; i++) {
	for (j = 0; j < size; j++) {
	result.append('<input type="text" class="values"/>');
	}
	result.append('<div class="clear"></div>');
	}
	result.append('<button id="button_2">CHECK</button>');
	result.append('<div class="clear"></div>');
	$("#button_2").click(function () {
	var result3 = $('#result3');

	var values = $('.values');
	r = []
	for (k=0;k<9;k++){
	num1=parseInt(values.get(k).value);
	r.push(num1);
	}
	num=r[0]
	res=0;
	for(m=0;m<9;m++){
	num=r[m]
	for (k=m+1;k<9;k++){
	if(num == r[k]){
	res=1;
	break;
	}
	}
	}
	if(res==1){
	$("#result3").text("THERE IS A DUPLICATION..PLEASE AVOID IT AND TRY AGAIN!");
	}
	<!-- else{-->
	<!-- flag = 0;-->
	<!-- for (k=0;k<9;k++){-->
	<!-- if(r[k] == ''){-->
	<!-- flag=1;-->
	<!-- break;-->
	<!-- }-->
	<!-- }-->
	<!-- if(flag==1){-->
	<!-- $("#result3").text("THERE IS A NULLFIELD..PLEASE FILL IT AND TRY AGAIN!");-->
	<!-- }-->
	else{


	var arr = [];
	for (i = 0; i < size; i++) {
	var innerarray = [];
	for (j = 0; j < size; j++) {
	num1=parseInt(values.get(i * size + j).value);
	innerarray.push(num1);
	}
	arr.push(innerarray);
	}


	//checking of magic square
	var magic = true;
	var magic_number = 0;
	var total = 0;

	//find the sum that makes the square magic
	for (c = 0; c < size; c++) {
	magic_number += arr[0][c];
	}
	//checking of every row total is equal or not the magic number
	for (r = 1; r < size; r++) {
	for (c = 0; c < size; c++) {
	total += arr[r][c];
	}
	if (total != magic_number)
	magic = false;
	total = 0;
	}
	//checking of every column total is equal or not the magic number
	for (c = 0; c < size; c++) {
	for (r = 0; r < size; r++) {
	total += arr[r][c];
	}
	if (total != magic_number)
	magic = false;
	total = 0;
	}
	//checking sum of the diagonals
	for (i = 0; i < size; i++) {
	total += arr[i][i];
	}
	if (total != magic_number)
	magic = false;
	total = 0;

	for (i = 0; i < size; i++) {
	total += arr[i][size - i - 1];
	}
	if (total != magic_number) {
	magic = false;
	}
	total = 0;
	if (magic) {
	$("#result2").hide();
	$("#result3").hide();
	$("#result1").text("CONGRATS...IT'S A MAGIC SQUARE!");
	} else {
	$("#result1").hide();
	$("#result3").hide();
	$("#result2").text("OOPS...IT'S NOT A MAGIC SQUARE....TRY AGAIN!");
	}
	}
	});

	//basil start

	$(".values").click(function () {
	console.log($(this).val());
	$(this).val('');
	});

	//basil end
	});



	</script>
	</head>
	<body>
	<h1 id='title' >MAGIC SQUARE</h1>
	<p id="result"></p>
	<p id="result1"></p>
	<p id="result2"></p>
	<p id="result3"></p>
	</body>
	</html>