1

I create a function that get two value(Number) and builds a table based on it;These two are the same value as the row and column of the table. For each row that create an tr and For each column that create an td and an input inside that.

I want to send that information to the backend and i need the unique code for each name attribute of input

<section id="table">
                <form class="w-100" action="/">
                    <div class="container">
                        <div class="d-flex w-100 justify-content-center align-items-center p-4">
                            column: <input onkeyup="table_creator()" onchange="table_creator()" name="column" class="ml-2" id="column" type="number">
                            row: <input onkeyup="table_creator()" onchange="table_creator()" name="row" id="row" type="number">
                        </div>
                    </div>
                    <div class="container">
                        <div class="row">
                            
                                <table  class="table table-striped">
                                    <tbody id="am_table_tb"></tbody>
                                </table>
                                <input class="btn btn-outline-success shadow-0" type="submit" value="create">
                        </div>
                    </div>
                </form>
</section>

JavaScript :

function table_creator() {
  column = document.getElementById("column").value;
  row = document.getElementById("row").value;
  var tbody = document.getElementById("am_table_tb");
  tbody.innerHTML= '';
  if (column != "" && row != "") {
    if (row != "" && row != 0) {
      for (var r = 0; r < row; r++) {
        var tr = document.createElement("tr");
        tbody.appendChild(tr);
        if (column != "") {
          for (var c = 0; c < column; c++) {
            var td = document.createElement("td");
            var input = document.createElement("input");
            input.setAttribute("type", "text");
            input.setAttribute("name", "uniqu_code");
            tr.appendChild(td);
            td.appendChild(input);
          }
        }
      }
    }
  }
}

I tried to create a unique code that mixture of number and text;We can get the number of inputs made ​​in the table by multiplying the column and row.So we can use zero to the number obtained for each attribute of input. How can i do it?

amirmohammad
  • 96
  • 7
  • 2
    You can also just use your `r` and `c` variables in the loops: `input.setAttribute("name", "uniqu_code_" + r + "_" + c);` – Hanlet Escaño Mar 30 '21 at 22:29
  • In addition to @HanletEscaño's comment, you can use the answer from https://stackoverflow.com/questions/58325771/how-to-generate-random-hex-string-in-javascript to generate a truly unique code, where `len` is the length of the digits you want for the unique code. – Dshiz Mar 30 '21 at 23:30
  • I think simply you have to do what @hanlet-escaño said for title of your question. but it make the server-side variables NOT able to handle easy. Usually for these kind of targets you better to use an array name and also `multidimensional array name`. So set name like this: `input.setAttribute("name", "cell["+r+"][]");` With this, you can handle the variables by calling them like `cell[0][1]` in your server. – MMMahdy-PAPION Apr 26 '21 at 10:54

0 Answers0