Redeem checkbox data stored in the database

Question

Redeem checkbox data stored in the database

Navigation

#1 by (2 votes)
#2 by (0 votes)

2

I am writing data from 6 checkboxes in the bank. I'm treating each one separately, as below:

              <tr>
              <td>Tabela Nutricional:</td>
              <td><input type="checkbox" name="export_tabela[1]" id="export_tabela[1]" value="PORTUGUES"> Português
                  <input type="checkbox" name="export_tabela[2]" id="export_tabela[2]" value="INGLES"> Inglês
                  <input type="checkbox" name="export_tabela[3]" id="export_tabela[3]" value="ESPANHOL"> Espanhol
                  <input type="checkbox" name="export_tabela[4]" id="export_tabela[4]" value="FRANCES"> Francês
                  <input type="checkbox" name="export_tabela[5]" id="export_tabela[5]" value="ARABE"> Árabe
                  <input type="checkbox" name="export_tabela[6]" id="export_tabela[6]" value="COREANO"> Coreano</td>
              </tr>

I can save all that have been marked on the registration page and the table is correctly:

MyproblemisthatatthetimeofretrievingthedatausingAjax,itdoesnotmarkanyvaluesintheeditbox'scheckbox,whoseHTMListhesameastheregistrationpage.TheAjaxIuse,shownbelow,writescorrectlyinallotherfields,takestheidandwritesthevalue:

       // Verifica se foi concluído com sucesso e a conexão fechada (readyState=4)
        if (xmlreq.readyState == 4) {
            // Verifica se o arquivo foi encontrado com sucesso
            if (xmlreq.status == 200) {
                //Se o retorno foi vazio do MySQL
                if (xmlreq.responseText == "") {
                    document.getElementById("projeto").focus();
                    alert("Não existe o projeto informado!");
                    ids.forEach(function (id) {
                        document.getElementById(id).value = '';
                        document.getElementById("projeto").value = '';
                    });
                //Se encontrou dados
                } else {
                    //Aqui recebe os dados do processa.php, abre e aplica nos campos desejados
                    var dados = JSON.parse(xmlreq.responseText);
                    // função para preencher os campos com os dados
                    ids.forEach(function (id) {
                        document.getElementById(id).value = dados[id];
                    });
                }
            } else {
                result.innerHTML = "Erro: " + xmlreq.statusText;
            }
        }

Any suggestions on how I can bring the fields and mark them on the update page?

html ajax checkbox

asked by anonymous 14.01.2016 / 11:51

2 answers

2

To mark a checkbox you need to give a Boolean value to the checked property of the element.

As you are using a <form> to send the original data to PHP then only the checked checkboxes will be sent, which means that at the time of restoring this state you can mark as .checked = true; all that are part of this JSON.

You can then do this in your loop:

var dados = JSON.parse(xmlreq.responseText);
// função para preencher os campos com os dados
ids.forEach(function (id) {
    document.getElementById(id).checked = true;
    document.getElementById(id).value = dados[id];
});

But you can optimize this code if you already have an object with these IDs, so avoid using getElementById or querySelector excessively as in the example above. It would look something like:

// quando a página carrega fazes cache desses elementos
var checkboxes = {};
["export_dizeres[1]", "export_dizeres[2]", "export_dizeres[3]","export_dizeres[4]", "export_dizeres[5]", "export_dizeres[6]", "export_tabela[1]", "export_tabela[2]", "export_tabela[3]", "export_tabela[4]", "export_tabela[5]", "export_tabela[6]"].forEach(function(id){
    checkboxes[id] = document.getElementById(id);
});

// e depois dentro do ajax basta fazer:

var dados = JSON.parse(xmlreq.responseText);
// função para preencher os campos com os dados
ids.forEach(function (id) {
    checkboxes[id].checked = true;
    checkboxes[id].value = dados[id]; // caso queiras também setar o valor
});

14.01.2016 / 12:23

Model, View and Controller "Multipurpose" - Laravel 5.1 How to use CHARSET correctly in AngularJS

score 0 · Accepted Answer

Solved by editing ajax: I have declared the checkbox ids separately:

    var ids2 = ["export_dizeres[1]", "export_dizeres[2]", "export_dizeres[3]","export_dizeres[4]", "export_dizeres[5]", "export_dizeres[6]", "export_tabela[1]", "export_tabela[2]", "export_tabela[3]",
           "export_tabela[4]", "export_tabela[5]", "export_tabela[6]"];

Then, at the time of uploading the data, I used the @Sergio suggestion:

                    ids2.forEach(function (id2) {
                    document.getElementById(id2).checked = dados[id2];
                });

Thanks for the help.