Динамическое создание таблицы доски судоку с использованием JavaScript

Я пытаюсь создать доску судоку, используя этот скрипт:

Проблема в том, что я не знаю, как проверить, чтобы генерировать уникальные числа на столбцах и квадратах.

На самом деле это просто проверка и генерация уникальных чисел только по строкам.

Вот этот код:

function generate(count, values) {
return Array.apply(null, { length: count }).map(function () {
    var r = [],
        array = values.slice();
    while (array.length) {
        r.push(array.splice(Math.floor(Math.random() * array.length), 1)[0]);
    }
    return r;
});
};

var myStringArray = generate(9, [1, 2, 3, 4, 5, 6, 7, 8, 9]);

Array.from(document.getElementsByClassName('cell')).forEach(function(e, i){
  var y = Math.floor(i/myStringArray.length);
  var x = i % myStringArray.length;
  e.textContent = myStringArray[y][x];

});
.container{
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items : center;
    justify-content : center;
    margin-bottom: 0;
}

.table {
    display:table;
    border: 2px solid #444;
    border-collapse: collapse;
    position: relative;
}
.row {
    display:table-row;
    position: relative;
    z-index:-1;
}
.cell {
    display:table-cell;
    padding:8px;
    border: 1px solid #ff0000;
    text-align: center;
}
.cell:nth-child(3), .cell:nth-child(6){border-right: 5px solid #555; } /*vertical*/
.row:nth-child(3) .cell, .row:nth-child(6) .cell{border-bottom: 5px solid #555;}  /*horizontal*/

.header {
text-align:center;
  position: relative;
}

.header {
 counter-increment: colno;                
}
.header::before {
  content: counter(colno); 
  position: absolute;
  top: -30px;
  font-weight:bold;
    color: #777;
}
.row:nth-child(n+1) {
    counter-increment: rowno;                
}
.row:nth-child(n+1)::before{
  content: counter(rowno); 
  position: absolute;
  left: -30px;
  top:10px;
  font-weight:bold;
  color: #777;
}
<div class="container">
<div class="table">
  <div id="mytab1" class="row">
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
    <span class="cell header">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  <div class="row">
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
    <span class="cell">***</span>
  </div>
  </div>
</div>

Пожалуйста, посетите скрипкуВот

Спасибо за помощь, спасибо

Ответы на вопрос(1)

Ваш ответ на вопрос