There is a code that creates lines of this type:

5 numbers space one additional number ( xxxxx x ) ,

and you need to do

5 numbers and 5 additional numbers ( xxxxx xxxxx x ) .

To consider as one combination a set from 5 basic numbers and 5 additional.

Basic numbers with an additional 1 combination 1 time can be repeated for a request. One combination with another combination for one request for any number of combinations should not be repeated.

 function generate() { document.getElementById("myTable").innerHTML = ""; const numbers = (new Array(25)).fill(1).map((a, i) => a + i); let resultSet = new Map(); let qnt = parseInt(document.getElementById('quantity').value, 10); while (resultSet.size < qnt) { let nums = shuffle(numbers).slice(0, 5); let key = (nums.sort() + ''); resultSet.set(key, nums); } resultSet.forEach(val => { const main = createTableWithContent(val.join('-'), "one"); const additional = createTableWithContent(randInt(), "two"); main.append(additional); document.getElementById("myTable").append(main); }) } function shuffle(arr) { return arr.map(el => { return { item: el, sort: Math.random() } }).sort((a, b) => a.sort - b.sort).map(el => el.item); } function randInt(min = 1, max = 4) { return Math.floor(Math.random() * (max - min + 1)) + min; } function createTableWithContent(content, className) { const tableEl = document.createElement("TABLE"); tableEl.className = className || ""; tableEl.append(content); return tableEl; } 
 <input id="quantity" type="text" placeholder="Кол-Π²ΠΎ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°Ρ†ΠΈΠΉ" style="background: #ffffff!important;color: #8f2d00!important;font-size: 20px!important;"/><input class="annoying-btn" type="button" value="ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°Ρ†ΠΈΠΈ" onclick="generate()" /> <div id="myTable"></div>

How to make, that after a dash, 5 digits are also generated, and not one like now?

  • four
    you bother to at least write that this code decides, and not just "there is code." with such a description of the question, few will want to help you. And in general, it would not hurt to explain what you have difficulty with updating this code - teran
  • Replace randInt signature with randInt(min = 10000, max = 99999) and you will have 5 digits - teran
  • If by β€œafter the dash” is meant the second line in the output - teran
  • @teran Now the code generates the digits of the form xxxxxx-x, but xxxxxx-xxxxx and the main one is necessary so that the left digits do not coincide with the right ones, so it’s not so that in all combinations the left digits coincide with the right ones. Conventionally, I put 100 combinations and were not in all combinations of the same numbers. - Arcadiy 8:49
  • one
    Anyway, nothing is clear. Give an example of a valid result in the question, and an invalid one - Zergatul

1 answer 1

I hope that I understood you correctly. I made you so that now at the beginning a new table is created each time you press the button and new lines are entered into it. The old table is deleted. The table is now always one, and there are plenty of rows in it. In your code, you incorrectly added many tables.

I replaced your Map resultSet with a regular array, since in the Map I do not see the need. And in general, even the array is not needed here, because You can fill the table directly, but in this case you will have to add the variable counter instead of result.length in while . But I left this array to make you more familiar and understandable.

Decision

 var tableEl; function generate() { var myTable = document.getElementById("myTable"), numbers = (new Array(25)).fill(1).map((a, i) => a + i), result = [], qnt = parseInt(document.getElementById('quantity').value, 10); myTable.innerHTML = ''; tableEl = document.createElement("TABLE"); myTable.appendChild(tableEl); while(result.length < qnt) { var left = shuffle(numbers).slice(0, 5).join('-'), right = shuffle(numbers).slice(0, 5).join('-'); //Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ Π±Ρ‹Π»ΠΈ Ρ€Π°Π²Π½Ρ‹ ΠΌΠ΅ΠΆΠ΄Ρƒ собой if(left == right) continue; result.push([left, right]); fillTableWithContent(left + ' ' + right); } } function shuffle(arr) { return arr.map(el => { return { item: el, sort: Math.random() } }).sort((a, b) => a.sort - b.sort).map(el => el.item); } function fillTableWithContent(content) { tableEl.insertRow(tableEl.rows.length) .insertCell(0).appendChild(document.createTextNode(content)); } 
 <input id="quantity" type="text" placeholder="Кол-Π²ΠΎ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°Ρ†ΠΈΠΉ"/> <input type="button" value="ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°Ρ†ΠΈΠΈ" onclick="generate()"/> <div id="myTable"></div>

If something is not clear, please ask.

  • Thank you very much, what you need. Answer accepted! - Arcadiy
  • The only request is how can I visually separate the left with the right styles? - Arcadiy
  • one
    @Arcadiy, I wanted to do it right away, but you wrote that you need a space. In general, you need to change the fillTableWithContent function to this: function fillTableWithContent(first, second) { var row = tableEl.insertRow(tableEl.rows.length); row.insertCell(0).appendChild(document.createTextNode(first)); row.insertCell(1).appendChild(document.createTextNode(second)); } function fillTableWithContent(first, second) { var row = tableEl.insertRow(tableEl.rows.length); row.insertCell(0).appendChild(document.createTextNode(first)); row.insertCell(1).appendChild(document.createTextNode(second)); } function fillTableWithContent(first, second) { var row = tableEl.insertRow(tableEl.rows.length); row.insertCell(0).appendChild(document.createTextNode(first)); row.insertCell(1).appendChild(document.createTextNode(second)); } - Bharata