A while back I worked on a sudoku game with a help of a lot of the guys on the forum. I've got a weird bug that I need some help with.

Basically I worked on this game in the wrong way. I had to create the game using a css grid. The problem I had is that I made it without generating it through Javascript. Not a huge problem at first, but it was only after I generated the puzzles that I saw the big problem. Instead of generating puzzles by rows it generated them by every 9x9 square. This meant that not only the generation of puzzles was wrong, but comparing them to the solution would also be wrong, along with any hint method I put in. It took a long three weeks+ but I fix two of those. However coding the hint method has made me realise that my approach was awful.

My question is.

Do I carry on with trying to fix something that shouldn't have been this broken from the start? I'm going to pose the hint code below. Please don't scream.

Or

Do I wipe this thing from the earth and start again? if you think it's easier for me to simply just delete everything, and generate the grid via script then I'm going to need some help, how would I go about doing this?


The horror that is the Hint code.

Code:
function hint_btn(solution, grid, puzzleHolder)
{ 
	if(solution[0] == null)
	{
		alert("Please choose a game");
	}
	else
	{
		//HINT BUTTON
		var temp = Math.floor((Math.random()*81));


		//If temp is not = 0 then temp gets a new random number.  
		if (puzzleHolder[temp] != 0)
		{
			temp = Math.floor((Math.random()*81));
		}
		else
		{
			hint = solution[temp];	
		}
			

		//alert(hint + " and " + temp);
			
			//For loop through the length of the grid. If puzzleHolder[i] = 0, then cycle through that. 
			//If i 
			for(var i = 0; i <= grid.length; i++)
			{
				if(i < 9)
				{
					if(puzzleHolder[i] == 0)
					{
						//alert("The amount of 0's in this row " + i)
						
						//CHECK THIS SOMETHING WRONG WITH i == HINT: DONE!!!
						if(i == temp)
						{
							if(row_1[i].getElementsByTagName('input').input.value != solution[i] && row_1[i].getElementsByTagName('input').input.value != "" )
							{
								//row_1[i].getElementsByTagName('input').input.value = hint;
								//row_1[i].getElementsByTagName('input').input.value = hint;
								alert("Wrong Value: " + row_1[i].getElementsByTagName('input').input.value);
							}
						}
					}
				}
				
				if (i>= 9  && i < 18)
				{
					//row_2[i-9].innerHTML=puzzleHolder[i];
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if(row_2[i-9].getElementsByTagName('input').input.value != solution[i] && row_2[i-9].getElementsByTagName('input').input.value != "" )
							{
								alert("Wrong Value: " + row_2[i-9].getElementsByTagName('input').input.value);
							}
		
						}
					}
				}
				
				if( i >= 18 && i < 27)
				{
					//row_3[i-18].innerHTML=puzzleHolder[i];	
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if(row_3[i-18].getElementsByTagName('input').input.value != solution[i] && row_3[i-18].getElementsByTagName('input').input.value != "")
							{
						  		 alert("Wrong Value: " + row_3[i-18].getElementsByTagName('input').input.value);	
							}
		
						}
					}
				}
				
				if( i >= 27 && i < 36)
				{
					//row_4[i-27].innerHTML=puzzleHolder[i];
					
					//alert(puzzleHolder[i]);	
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if( row_4[i-27].getElementsByTagName('input').input.value != solution[i] && row_4[i-27].getElementsByTagName('input').input.value != "")
							{
						  		 alert("Wrong Value: " + row_4[i-27].getElementsByTagName('input').input.value);	
							}

						}
					}
				}
				
				if( i >= 36 && i < 45)
				{
					//row_5[i-36].innerHTML=puzzleHolder[i];
					
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if(row_5[i-36].getElementsByTagName('input').input.value != solution[i] && row_5[i-36].getElementsByTagName('input').input.value != "")
							{
								alert("Wrong Value: " + row_5[i-36].getElementsByTagName('input').input.value);		
							}

						}
					}
				}
				
				if( i >= 45 && i < 54)
				{
					//row_6[i - 45].innerHTML=puzzleHolder[i];
					
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if( row_6[i-45].getElementsByTagName('input').input.value != solution[i] && row_6[i-45].getElementsByTagName('input').input.value != "")
							{
								alert("Wrong Value: " + row_6[i-45].getElementsByTagName('input').input.value);		
							}
	
						}
					}
				}	
				
				if (i >= 54 && i < 63)
				{
					//row_7[i-54].innerHTML=puzzleHolder[i];
					
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if(row_7[i-54].getElementsByTagName('input').input.value != solution[i] && row_7[i-54].getElementsByTagName('input').input.value != "")
							{
								alert("Wrong Value: " + row_7[i-54].getElementsByTagName('input').input.value);			
							}

						}
					}
				}
				
				if( i >= 63 && i < 72)
				{
					//row_8[i-63].innerHTML=puzzleHolder[i];
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if (row_8[i-63].getElementsByTagName('input').input.value != solution[i] && row_8[i-63].getElementsByTagName('input').input.value != "")
							{
					   			alert("Wrong Value: " + row_8[i-63].getElementsByTagName('input').input.value);	
							}

						}
					}
				}	
				
				if( i >= 72 && i < 82)
				{
					//row_9[i-72].innerHTML=puzzleHolder[i];
					
					if(puzzleHolder[i] == 0)
					{
						if(i == temp)
						{
							if( row_9[i-72].getElementsByTagName('input').input.value != solution[i] && row_9[i-72].getElementsByTagName('input').input.value != "")
							{
							 	alert("Wrong Value: " + row_9[i-72].getElementsByTagName('input').input.value);	
							}
						}
					}
				}
			}
		}
}