Use math.random() without repeat those random numbers in the array

Question

I'm using the math.random() variable to display random numbers in combination with other elements.But when I run the random numbers are repeated. And I want Random digits starting from 1 How can I slove it. If you can help me, I would greatly appreciate it.

This is reult:

Winer: William1,James0,Evelyn5,Harper7,Mason2,Ella1

I want to display results like this.

Winer: William1,James5,Evelyn3,Harper7,Mason2,Ella4

'use strict';
function start() {
    // Choose member
    const members = document.querySelectorAll('input[type="checkbox"]:checked');
    // Chọn số tương ứng với số thành viên 
    const hitNum = +document.querySelector('select[name="hit"]').value;
    // Chọn số kết hợp với thành viên
    const ChooseNumber = +document.querySelector('select[name="number"]').value;
    // Nếu trong trường hợp số thành viên không bằng số đã chọn 
    if(members.length != hitNum) {
        alert("Số que khong tuong ung voi so thanh vien da chon");
        return;
    }
    const lotArr = ('1'.repeat(hitNum) ).split('');
    const result = [[], []];

     for(const e of members) {
       
        const rnd = Math.floor(Math.random() * lotArr.length);
        const pickup = lotArr.splice(rnd, 1)[0];
    
}   
       result[pickup].push(e.value + Math.floor(Math.random() * (members.length+2)));
        
    }
    document.querySelector('#result h3:first-child').textContent = 'Winer:   ' + result[1].join();





     // const lotArr = ('1'.repeat(hitNum) + '0'.repeat(ChooseNumber)).split('');
    
    // const result = [[], []];
    
    // for(const e of members) {
       
    //     const rnd = Math.floor(Math.random() * lotArr.length);
    //     const pickup = lotArr.splice(rnd, 1)[0];
        
    //     result[pickup].push(e.value);
    // }
   
    // document.querySelector('#result h3:first-child').textContent = 'Winer' + result[1].join();
    
}

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<link rel="stylesheet" href="lotte.css">
<script src="lotte.js"></script>
<!-- <script src="snow.js"></script> -->

<body>
  <div class="wrapper">
  <div class="area">
    <div id="member">
         <h2>Choose the member</h2>
         
          <div id="honsuu">

      Member：<select name="hit">
      <option value="1"selected>1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
      <option value="11">11</option>
      <option value="12">12</option>
      <option value="13">13</option>
      <option value="14">14</option>
      <option value="15">15</option>
      <option value="16" >16</option>
      <option value="17">17</option>
      <option value="18">18</option>
      <option value="19">19</option>
      <option value="20">20</option>
      <option value="21">21</option>
      <option value="22">22</option>
       <option value="23">23</option>
      <option value="24">24</option>
      <option value="25">25</option>
      <option value="26">26</option>
      <option value="27">27</option>
      <option value="28" >28</option>
      <option value="29">29</option>
      <option value="30">30</option>
      <option value="31">31</option>
      <option value="32">32</option>
      <option value="33">33</option>
      <option value="34">34</option>
      <option value="35">35</option>
      <option value="36">36</option>
      <option value="37">37</option>
      <option value="38">38</option>
      </select>　<!--

-->   Number：<select name="number">
      <option value="1"selected>1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
      <option value="11">11</option>
      <option value="12">12</option>
      <option value="13">13</option>
      <option value="14">14</option>
      <option value="15">15</option>
      <option value="16" >16</option>
      <option value="17">17</option>
      <option value="18">18</option>
      <option value="19">19</option>
      <option value="20">20</option>
      <option value="21">21</option>
      <option value="22">22</option>
       <option value="23">23</option>
      <option value="24">24</option>
      <option value="25">25</option>
      <option value="26">26</option>
      <option value="27">27</option>
      <option value="28">28</option>
      <option value="29" >29</option>
      <option value="30">30</option>
      <option value="31">31</option>
      <option value="32">32</option>
      <option value="33">33</option>
      <option value="34">34</option>
      <option value="35">35</option>
       <option value="36">36</option>
      <option value="37">37</option>
      <option value="37">38</option>
      </select><br>
    </div>
    <div class="button" style="text-align: center;" >

      <input type="button"value="Start"  onclick="start();"> 
   
    </div>
    <div id="result">
      <h3>Winner</h3>
      
    </div>
  </div>
         
         
         
      <table id="t01">
  <tr>
    <th>PART1</th>
    <th>PART2</th> 
    <th>PART3</th>
    <th colspan="2" style="text-align: center;">PART4</th>
   
    <th>PART5</th>
  </tr>
  <tr>
    <td><label><input type="checkbox" value="William"checked /> William</label>  </td>
    <td><label><input type="checkbox" value="James" checked/> James</label></td>
    <td><label><input type="checkbox" value="Evelyn" checked/> Evelyn</label></td>
    <td><label><input type="checkbox" value="Harper" checked/> Harper</label></td>
    <td> <label><input type="checkbox" value="Mason" checked/> Mason</label></td>
    <td><label><input type="checkbox" value="Ella" checked/> Ella</label></td>
    
  </tr>
  <tr>
    <td> <label><input type="checkbox" value="Jackson" /> Jackson</label></td>
    <td> <label><input type="checkbox" value="Avery" /> Avery</label></td>
    <td><label><input type="checkbox" value="English" /> English</label></td>
    <td> <label><input type="checkbox" value="Scarlett" /> Scarlett</label></td>
    <td><label><input type="checkbox" value="Jack" /> Jack</label></td>
    <td>  <label><input type="checkbox" value="David" />David</label></td>
  </tr>
  <tr>
    <td> <label><input type="checkbox" value="Eleanor" /> Eleanor</label></td>
    <td> <label><input type="checkbox" value="Madison" /> Madison</label></td>
    <td> <label><input type="checkbox" value="Ellie" /> Ellie</label></td>
    <td><label><input type="checkbox" value="Wyatt" /> Wyatt</label></td>
    <td>  <label><input type="checkbox" value="Hazel" /> Hazel</label></td>
    <td></td>
  </tr>
   <tr>
    <td> <label><input type="checkbox" value="Carter" /> Carter</label></td>
    <td><label><input type="checkbox" value="Julian" /> Julian</label></td>
    <td><label><input type="checkbox" value="Lily" /> Lily</label></td>
    <td><label><input type="checkbox" value="Grayson" /> 吉田</label></td>
    <td>  <label><input type="checkbox" value="奥村" /> Grayson</label></td>
    <td></td>
  </tr>
   <tr>
    <td> <label><input type="checkbox" value="Lincoln" /> Lincoln</label></td>
    <td><label><input type="checkbox" value="Hudson" /> Hudson</label> </td>
    <td><label><input type="checkbox" value="Everly" />Everly </label></td>
    <td><label><input type="checkbox" value="Lillian" /> Lillian</label></td>
    <td> <label><input type="checkbox" value="Addison" />Addison</label></td>
    <td></td>
  </tr>
   <tr>
    <td> <label><input type="checkbox" value="Willow" />Willow</label></td>
    
    <td> <label><input type="checkbox" value="Jaxon" />Jaxon</label></td>
    <td><label><input type="checkbox" value="Lucy" /> Lucy</label></td>
    <td> <label><input type="checkbox" value="Aubrey" />Aubrey</label></td>
    <td> <label><input type="checkbox" value="Ivy" />Ivy</label> </td>
    <td></td>
  </tr>
  <tr>
    <td>  <label><input type="checkbox" value="Kinsley" />Kinsley</label></td>
    <td><label><input type="checkbox" value="Miles" /> Miles</label></td>
    <td><label><input type="checkbox" value="Audrey" /> Audrey</label></td>
    <td> </td>
    <td> </td>
    <td></td>
  </tr>
   <tr>
    <td>  <label><input type="checkbox" value="Christian" /> Christian</label></td>
    <td> </td>
    <td></td>
    <td>  </td>
    <td>  </td>
    <td></td>
  </tr>
</table>
   
    </div>

   

</div>
  
</body>
</html>
William2,Jackson1,Eleanor0,Carter3,Lincoln4,Willow5,Kinsley7,Christian6

I'm not sure what you're asking but you can create an array like this `const arr = new Array(7).fill(0).map((_, i) => i + 1);` to get `[1, 2, 3, 4, 5, 6, 7]` then shuffle the array. — , Jul 08 '21 at 07:52
Why are you blocking out the most apparent tool for the task? Is there any good reason why not to use an array? You've to store the random numbers anyway to check the dupes, an array is probably one of the lightest way to do it. — Teemu, Jul 08 '21 at 07:53
@ChrisG The random number depends on the number of participants. It is not fixed from 1 to 7 — Hiep Anh, Jul 08 '21 at 07:59
@HiepAnh You know you don't have to hardcode `7`, you can use the number of the participants (`members.length`) instead ..? — Teemu, Jul 08 '21 at 08:00
Are you looking for something like this: https://jsfiddle.net/53r8zjq2/ ? — , Jul 08 '21 at 08:08
@ChrisG I am extremely impressed with this. Thank you so much — Hiep Anh, Jul 09 '21 at 01:58
I use your code in my post but it says member.map is not function const members = document.querySelectorAll('input[type="checkbox"]:checked'); this is link https://jsfiddle.net/duchiep2607/924b1nfy/2/ : Please help me — Hiep Anh, Jul 09 '21 at 02:44
In my code, `members` is an array of strings. In your code, it's a list of elements. You need something like `Array.from(members).map(checkbox => checkbox.value)` to get the list of names — , Jul 09 '21 at 07:10
@ChrisG I'm new to javascript, so can you help me fix my code.I really appreciate this, thank you so much.https://jsfiddle.net/duchiep2607/924b1nfy/2/ — Hiep Anh, Jul 09 '21 at 08:00

Use math.random() without repeat those random numbers in the array

0 Answers0