<p>You will need backtracking, because it is possible to add numbers to the Sudoku board which don't violate any rules immediately, but which will lead to a contradiction later on. If you take any unique-solution Sudoku problem and arbitrarily place any number anywhere, you are bound to experience just this.</p>

<p>I suggest you investigate the <a href="https://arxiv.org/abs/cs/0011047" rel="nofollow noreferrer">Dancing Links</a> algorithm. You can easily formulate Sudoku as a set cover problem, and that algorithm can find a solution if there exists one. For the completely empty board, there has to be a solution. Randomize the matrix if you want to obtain a random result.</p>

<p>Also investigate <a href="https://stackoverflow.com/questions/tagged/sudoku?sort=votes">all the other sudoku-tagged questions</a>, since you are not the first trying to generate such boards, and translating from one language to another doesn't really change the game that much.</p>
Dynamic generate sudoku board table using javascript
<p>I am trying to to generate a Sudoku board using this script:</p>

<p>The problem is that I don't know how to validate to generate unique numbers on columns and squares.</p>

<p>Actually is just validating and generating unique numbers only on rows.</p>

<p>Here is that code :
<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>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];

});</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>.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;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
&lt;div class="table"&gt;
  &lt;div id="mytab1" class="row"&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
    &lt;span class="cell header"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
    &lt;span class="cell"&gt;***&lt;/span&gt;
  &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>Please visit fiddle <strong><a href="https://jsfiddle.net/707bshLy/12/" rel="nofollow noreferrer">here</a></strong></p>

<p>Appreciate your help,
Thanks</p>