0

Tenho um formulário que tem um botão de marcar todos os checksbox em uma datatable. Até aí, tudo certo. O que não estou conseguindo fazer é pegar o valor das checkbox marcadas e retornar o valor 1 em outro input dentro do datatable.

Tentei assim:

var checkbox = document.getElementsByName('marcar[]');

    var cps = document.getElementById("Numbloqueios");    
    function addCheck() {
      var teste = [];
      for (var i = 0; i < checkbox.length; i++) {
        if (checkbox[i].checked == 0) teste.push(checkbox[i].value);
      }
      cps.innerHTML = teste.join();
    }

HTML:

<div class="col-md-8">
                            <div class="row">

                                <div class="col-md-3 col-md-offset-3">
                                    <label for="todos">Selecionar Todos:</label>
                                    <button class='btn btn-large' type='button' title='Todos' id='todos'
                                        onclick='marcardesmarcar();'>
                                        <i class='icon-large  icon-ok'>Aperte Aqui</i>

                                    </button>
                                </div>

                                <div class="col-md-6">
                                    <label for="salvar">Para Aprovar:</label>
                                    <button class='btn btn-large' type='button' title='salvar' id='salvar' onclick='addCheck()'>
                                        <i class='icon-large  icon-ok'>Aperte Aqui</i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-12" data-type="tabledetail" data-show-properties="" data-field-name="Itens2">
                    <div class="form-input">
                        <label class="text-danger">Lançamentos</label>
                        <table tablename="tableItens" class="table table-bordered table-striped" noaddbutton="true">
                            <thead class="thead-light">
                                <tr class="active">
                                    <td></td>
                                    <td></td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>

                                    <td style="text-align: center; vertical-align:middle">
                                        <div class="col-sm-1" data-type="textbox" data-show-properties=""
                                            data-field-name="checar" id="indexador">
                                            <div class="form-input">
                                                <div class="form-group"></div>
                                            </div>
                                            <input type="checkbox" class="marcar" value ="" id="marcar" name="marcar">
                                        </div>
                                    <td>

bom pessoal eu fiz alguma coisa errada usando o exemplo do @Danilo Leone, eu tentei novamente e fiz algumas adaptações, conform abaixo.

<script type="text/javascript">

    function get_all_id() {
        var checkbox = document.getElementsByClassName('marcar[]');
        var cpbloq = document.getElementById('cpnumbloqueios').value;

        var cps = document.querySelector('input[name="Numbloqueios"]');
        var teste = [];
        for (var i = 0; i < checkbox.length; i++) {
            if (checkbox[i].checked == 1 && (cpbloq = 1) ) teste.push(checkbox[i].value);
        }

        cps.innerHTML = teste.join();
        console.log(teste);

    }
</script>

Mas o console.log retorna vazio.

5
  • Como está seu html? Commented 14/03/2019 às 20:30
  • O checkbox não tem value e o name não deveria ser marcar[] Commented 14/03/2019 às 20:40
  • Seu código HTML está incompleto. Onde estão os checkboxes? Onde está o botão "marcar"?
    – Sam
    Commented 14/03/2019 às 22:12
  • Editei a pergunta, as checkbox estão em uma datatable, que é montada dinamicamente, como eu disse, o botão de marcar todos esta ok, essa funcionalidade que desejo implantar seria no botão aprovar todos, que assim ao clicar o codigo iria verificar quem esta marcado e alterar o valor de um input que aprace em cada ROW do datatable. Commented 15/03/2019 às 12:02
  • Não consegui ainda... Commented 18/03/2019 às 16:37

3 Respostas 3

0
function addCheck() {
var checkbox = document.getElementsByName('marcar[]');

var cps = document.getElementById("Numbloqueios");  
  var teste = [];
  for (var i = 0; i < checkbox.length; i++) {
    if (checkbox[i].checked == 0) teste.push(checkbox[i].value);
  }
  cps.innerHTML = teste.join();
}
4
  • não deu certo... Commented 14/03/2019 às 20:36
  • editei sua resposta com o que eu tentei fazer, mas o console retorna vazio. Commented 15/03/2019 às 15:44
  • 1
    @BrunoRayol Não edite a resposta adicionando novas informações sobre a pergunta. Para isso, edite a sua própria pergunta e adicione as novas informações.
    – LipESprY
    Commented 15/03/2019 às 15:55
  • desculpe, estou aprendendo.... Commented 15/03/2019 às 16:16
0

"- O que não estou conseguindo fazer é pegar o valor das checkbox marcadas e retornar o valor 1 em outro input dentro do datatable"

Com esse simples script você consegue retornar o valor de cada input:

document.getElementById('btn').addEventListener(
    'click',
    function(){
        let checkboxs = document.querySelectorAll('input[type="checkbox"]:checked');
        let valores = [];

        // NodeList:
        //console.log(checkboxs);

        // Cada loop é referente a um checkbox - semelhante ao foreach do php
        for (let chbx of checkboxs) {
            // console.log(chbx.value);
            valores.push(chbx.value);
        }
        
        document.getElementById('valores_junto').innerHTML = valores.join(' ');
    },
    false
);
label {
    display: block;
}
<!DOCTYPE html>
<html>
    <head>
        <title>Retornar valor dos checkboxes marcados</title>
    </head>
    <body>
        <form>
            <label>Checkbox #1
                <input type="checkbox" value="1">
            </label>
            <label>Checkbox #2
                <input type="checkbox" value="2">
            </label>
            <label>Checkbox #3
                <input type="checkbox" value="3">
            </label>
            <button type="button" id="btn">Retornar marcados</button>
            <div id="valores_junto"></div>
        </form>
    </body>
</html>

Coloquei os valores em uma div. Agora é só você aplicar no seu projeto.

4
  • O problema é que monto os checkbox em uma datatable dinamica.... Commented 14/03/2019 às 21:14
  • @BrunoRayol e qual o problema? Só vc "ajustar" conforme sua necessidade...
    – LipESprY
    Commented 14/03/2019 às 21:16
  • eu acho que expliquei errado, os checkbox não possuem VALUES, eu tentei usar o seu exemplo acima adptando para meu form, mas não funcionou. Commented 14/03/2019 às 21:17
  • @BrunoRayol no seu "- tentei assim" tá bem claro que vc quer os values. Veja: checkbox[i].value. Mas em fim. Com os nós (nodes), você pode pegar qualquer propriedade que quiser. Agora é com vc! ;)
    – LipESprY
    Commented 14/03/2019 às 21:34
0

Depois de muito pesquisar e pedir ajuda em outros lugares, segue abaixo como eu resolvi esse meu desafio.

function checaMarcador(){
        var linha;
        $('td').click(function(){
            var row_index = $(this).parent().index();
            var col_index = $(this).index();
            linha = row_index;              
            var bloqueado = 1;
            var desbloqueado = 0;               
            var marcador = document.getElementById("marcar___" + linha).checked;                
            if (marcador == true) {
                $("#Numbloqueios___" + linha).val(desbloqueado);
            } else {
                $("#Numbloqueios___" + linha).val(bloqueado);
            }

        })
    };

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .