Skip to main content
eliminar saludos, despedidas.
Origen Enlace
Rubén
  • 11.5k
  • 7
  • 41
  • 85

compañeros.

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividiodividido en <details>

El código, es un ejemplo muy similar a mi proyecto real. Espero puedan ayudarme. De ante mano, muchas gracias.

compañeros.

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividio en <details>

El código, es un ejemplo muy similar a mi proyecto real. Espero puedan ayudarme. De ante mano, muchas gracias.

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividido en <details>

El código, es un ejemplo muy similar a mi proyecto real.

se eliminó 1 carácter en el cuerpo
Origen Enlace
alanfcm
  • 20.9k
  • 11
  • 19
  • 35

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividio en <details>

function marcar(source) {
var checkboxes = document.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
        checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}

function marcarHijos(source) {
var form2 = document.getElementById("form2");
var checkboxes = form2.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
    checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}
<details>
    <summary>
        Grupo 1.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 1.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
    <summary>
        Grupo 2.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 2.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
</details>

function marcar(source) {
var checkboxes = document.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
        checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}

function marcarHijos(source) {
var form2 = document.getElementById("form2");
var checkboxes = form2.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
    checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}
<details>
    <summary>
        Grupo 1.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 1.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
    <summary>
        Grupo 2.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 2.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
</details>

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividio en

function marcar(source) {
var checkboxes = document.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
        checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}

function marcarHijos(source) {
var form2 = document.getElementById("form2");
var checkboxes = form2.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
    checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}
<details>
    <summary>
        Grupo 1.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 1.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
    <summary>
        Grupo 2.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 2.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
</details>

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividio en <details>

function marcar(source) {
var checkboxes = document.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
        checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}

function marcarHijos(source) {
var form2 = document.getElementById("form2");
var checkboxes = form2.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
    checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}
<details>
    <summary>
        Grupo 1.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 1.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
    <summary>
        Grupo 2.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 2.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
</details>

Origen Enlace
Saco04
  • 665
  • 1
  • 7
  • 23

Seleccionar todos los Checkbox de un campo específico, sin seleccionar los demás

compañeros.

Estoy realizando una página que me muestra información extensa traída desde una base de datos MySql y mostrada en tablas. Esta información se divide en una sección "padre", un secciones "hijas" que pertenecen a ese padre y dentro de esas hijas, se muestra la información. Todo esto está dividio en

El problema, está en que los "hijos" tendrán un "seleccionar todo", en donde se seleccionarán todos los checkbox que pertenezcan a ese hijo. El código que manejo ahora, me selecciona todos los checkbox que hay:

Aquí está el código:

function marcar(source) {
var checkboxes = document.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
        checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}

function marcarHijos(source) {
var form2 = document.getElementById("form2");
var checkboxes = form2.getElementsByTagName('input'); //obtenemos todos los controles del tipo Input
for (i = 0; i < checkboxes.length; i++) //recorremos todos los controles
{
    if (checkboxes[i].type == "checkbox") //solo si es un checkbox entramos
    {
    checkboxes[i].checked = source.checked; //si es un checkbox le damos el valor del checkbox que lo llamó (Marcar/Desmarcar Todos)
    }
}
}
<details>
    <summary>
        Grupo 1.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 1.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
    <summary>
        Grupo 2.
    </summary>
    <details>
        <summary><input type="checkbox" onclick="marcar(this);">Grupo 2.1</summary>
        <input type="checkbox" name="check1">Primera Información.
        <input type="checkbox" name="check1">Segunda Información.
        <input type="checkbox" name="check1">Tercera Información.
    </details>
</details>

He publicado mi código con snippet, para que puedan comprobar a qué me refiero.

Sólo necesito que al seleccionar un hijo, todos los checkbox que están adentro de ese hijo, se seleccionen, sin tocar los otros hijos.

El código, es un ejemplo muy similar a mi proyecto real. Espero puedan ayudarme. De ante mano, muchas gracias.