Home / Questions / 14089
Accepted
Alan
Asked: 2020-06-16 12:42:49 +0800 CST 2020-06-16 12:42:49 +0800 CST

How to create a dynamic associative object or array in JavaScript?

  • 772

table and I want to capture the position of the ( td ) where the selects are selected, this happens in a click event . I have the following:

                //creo el objeto
                 var objetoSelects = new Object();
                 $('#vistaPre tbody tr').each(function (index) {
                    $(this).find("td").each(function(i, el) {
                        // .selectOptions son selects que tengo en un td de la tabla
                        $('.selectOptions').find(':selected').each(function(j, el) {
                            $this = $(this).val();
                            if ($this != '') {

                             // intento crear las posiciones del objeto

                             objetoSelects.$this = j;

                             objetoSelects.selects = $this;

                            }

                        });
                        // salgo del each
                        return false;
                    });
                    // salgo del each
                    return false;
                });

My intention is to create an object like this:

// $this es el valor del select ejemplo ('item1')
// j es el contador en este caso la posición actual del <td>
// selects es el valor que le deseo dar a mi otro dato (creo que no esta bien)
objetoSelects(itemx = x, 'selects' = itemx);

I can't find a way to do it.

UPDATE

Based on the answers, I found a way to do it, below is the way I solved the problem

                // cree arrays para guardar la posición del <td> y el valor del select
                var arraySelects  = [];
                var arrayPosition = [];

                $('#vistaPre tbody tr').each(function (index2) {
                    $(this).find("td").each(function(i, el) {
                        //
                        $('.selectOptions').find(':selected').each(function(j, el) {
                            $this = $(this).val();
                            if ($this != '') {

                                //agrego los datos correspondientes
                                arrayPosition.push(j);
                                arraySelects.push($this);

                            }

                        });
                        return false;
                    });
                    return false;
                });
                // creo el objeto y le asigno los valores
                var datoSelect = { 'position': arrayPosition, 'selects': arraySelects};
javascript

3 Answers

  1. Best Answer

    Alan, here is an example of what you are looking for. Native JS script without external libraries.

    //Aqui buscamos todos los TR de la tabla
var a = document.querySelectorAll("table tr");
var arreglo = [];
if(a != undefined || a!= null){
  for(var b in a){ //Como que Query Selector All nos entrega un array, entonces ieramos
    var c = a[b];
    if(typeof c == "object"){ //Solo ocupamos los objetos 
      var check = c.querySelector("td input[type='checkbox']:checked"); //ahora que tenemos los tr entonces buscamos dentro de ellos los checkbox que esten checked
      if(check.checked){ //Si estan checked entonces...
        //aqui agrega tu array como necesites
        arreglo.push({"fila":c.rowIndex,"celda":check.parentNode.cellIndex});
        
      //console.log("Fila: "+c.rowIndex,"celda: "+check.parentNode.cellIndex);
      }
    }
  }
}
console.log(arreglo);
    <!--Te dejo un tabla para que puedas ejecutar el script, solo modifica a tus necesidades.-->
<table border="">
<tr>
  <td><input type="checkbox" id="a" name="a" checked="checked" /><label for="a">opcion</label></td>
  <td><input type="checkbox" id="b" name="b" /><label for="b">opcion</label></td>
  </tr>
  <tr>
  <td><input type="checkbox" id="c" name="c" /><label for="c">opcion</label></td>
  <td><input type="checkbox" id="d" name="d" checked="checked" /><label for="d">opcion</label></td>
  </tr>
  <tr>
  <td><input type="checkbox" id="e" name="e" checked="checked" /><label for="e">opcion</label></td>
  <td><input type="checkbox" id="f" name="f" /><label for="f">opcion</label></td>
  </tr>
</table>

    • 3

  2. I do not understand very well your question.

     var arraySelects = new Object();

    you create an object but from the name I assume you want an array?

    if you definitely want an object then you can do:

    arraySelects['clave'] = valor;

    Let's remember that arraySelectsyou created it as an object, after finishing that call, you can query arraySelects['key']replacing keyit with the name you gave it when you were saving it.

    • 1

  3. You can assign values ​​directly using the syntax to create objects:

    objetoSelects = {"items": x, "select": itemx}

    • 1