Edit html+php+jquery items

Asked

Viewed 289 times

1

I have to edit a record series, the same are listed in a table (see):

Table com os registros

This is the form of the image above:

 <div class="control-group">
                <table class="table table-bordered ">
                    <thead>
                    <tr style="backgroud-color: #2D335B">
                        <th>Nome do Envolvido</th>
                        <th>RG</th>
                        <th>Envolvimento</th>
                        <th>Opções</th>
                    </tr>
                    </thead>

                    <tbody>
                    <?php if (!$envolvidos) { ?>
                        <td colspan="5">Ainda sem envolvidos</td>
                    <?php } else {
                        foreach ($envolvidos as $r) { ?>
                                <tr>
                                    <td style="text-align: center">
                                        <input type="hidden" id="id_e" name="id_e"
                                               value="<?php echo set_value('id', $r->id); ?>">
                                        <input class="span9" type="text" id="nome_e" name="nome_e"
                                               value="<?php echo set_value('nome', $r->nome); ?>">
                                    </td>
                                    <td style="text-align: center">
                                        <input class="span6" type="text" id="rg_e" name="rg_e"
                                               value="<?php echo set_value('rg', $r->rg); ?>">
                                    </td>
                                    <td style="text-align: center">
                                        <select style="width: 120px" id="envolvimento_e" name="envolvimento_e"
                                                value="<?php echo set_value('envolvimento', $r->envolvimento); ?>">
                                            <option
                                                value="SOLICITANTE" <?php if ($r->envolvimento == 'SOLICITANTE') echo 'selected' ?>>
                                                Solicitante
                                            </option>
                                            <option
                                                value="AUTOR" <?php if ($r->envolvimento == 'AUTOR') echo 'selected' ?>>
                                                Autor
                                            </option>
                                            <option
                                                value="VITIMA" <?php if ($r->envolvimento == 'VITIMA') echo 'selected' ?>>
                                                Vítima
                                            </option>
                                            <option
                                                value="TESTEMUNHA" <?php if ($r->envolvimento == 'TESTEMUNHA') echo 'selected' ?>>
                                                Testemunha
                                            </option>
                                        </select>
                                    </td>
                                    <td style="text-align: center">
                                        <button type="button" id="enviar" class="btn btn-primary btn-lg"> Editar
                                        </button>
                                    </td>
                                </tr>
                        <?php }
                    } ?>
                    </tbody>
                    <thead>
                    <tr style="backgroud-color: #2D335B">
                        <th>Nome do Envolvido</th>
                        <th>RG</th>
                        <th>Envolvimento</th>
                        <th>Opções</th>
                    </tr>
                    </thead>
                </table>

And I’ve tried putting each tr within a form, the problem that editing only works for the first item of table the others does not fire the ajax that sends to the controller. See the ajax:

jQuery('#enviar').click(function () {
        var id = $('#id_e').val();
        var nome = $('#nome_e').val();
        var rg = $('#rg_e').val();
        var envolvimento = $('#envolvimento_e').val();

        $.post("<?php echo base_url(); ?>index.php/sbp/editarEnvolvido",
            {'id': id, 'nome': nome, 'rg': rg, 'envolvimento': envolvimento},
            function (data) {
                alert(data);
            }, "html");

    });

For better understanding here is the controller function that does the editing in the database:

function editarEnvolvido(){
    $id = $_POST['id'];
    $nome = $_POST['nome'];
    $rg = $_POST['rg'];
    $envolvimento = $_POST['envolvimento'];

    if((strcmp($id,"") != 0) && (strcmp($nome,"") != 0) && (strcmp($rg,"") != 0)){
        $data = array(
            'nome'                  => $nome,
            'rg'                    => $rg,
            'envolvimento'          => $envolvimento
        );
        if ($this->sbp_model->edit('envolvidos', $data, 'id', $id) == TRUE) {
            echo 'Salvo com sucesso!';
        } else {
            echo 'Erro ao tentar salvar!';
        }
    } else {
        echo 'Nome e/ou RG deve ser informado!';
    }
}

I would like to at least understand what is happening that the other lines does not fire the ajax, and accept additional suggestions to solve my problem. Grateful from the start!

  • When you said you put each form on a tr I imagine it only worked because you used the same id on the button #enviar which should work, can often be errors like this, even id for the form and tals

  • I get it, you have a suggestion for me to troubleshoot this record editing issue?

  • you can take the $r->id put as attribute in button and shape and make a serialize picking by id. I’m half run here, but it’s this way, half you already have there

  • Thanks man, I’ll try here! Thanks!

1 answer

1


You can only assign one id to do the bind of click, for this reason its ajax only works in the first item, and as everyone has the same id every time you do the sending, no matter which line you edit, you’ll always get the first one you find. So let’s go by parts:

Adjustment of the HTML

<td style="text-align: center">
    <input type="hidden" id="id_<?php echo set_value('id', $r->id); ?>" name="id_e" value="<?php echo set_value('id', $r->id); ?>">
    <input class="span9" type="text" id="nome_<?php echo set_value('id', $r->id); ?>" name="nome_e" value="<?php echo set_value('nome', $r->nome); ?>">
</td>
<td style="text-align: center">
    <input class="span6" id="rg_<?php echo set_value('id', $r->id); ?>" type="text" name="rg_e" value="<?php echo set_value('rg', $r->rg); ?>">
</td>
<td style="text-align: center">
    <select style="width: 120px" id="envolvimento_<?php echo set_value('id', $r->id); ?>" name="envolvimento_e" value="<?php echo set_value('envolvimento', $r->envolvimento); ?>">
        <option value="SOLICITANTE" <?php if ($r->envolvimento == 'SOLICITANTE') echo 'selected' ?>>
            Solicitante
        </option>
        <option value="AUTOR" <?php if ($r->envolvimento == 'AUTOR') echo 'selected' ?>>
            Autor
        </option>
        <option value="VITIMA" <?php if ($r->envolvimento == 'VITIMA') echo 'selected' ?>>
            Vítima
        </option>
        <option value="TESTEMUNHA" <?php if ($r->envolvimento == 'TESTEMUNHA') echo 'selected' ?>>
            Testemunha
        </option>
    </select>
</td>
<td style="text-align: center">
    <button type="button" onclick="enviar('<?php echo set_value('id', $r->id); ?>')" class="btn btn-primary btn-lg"> Editar
    </button>
</td>

Notice that I’ve granted the id of each record to actually have one ìd single for each line. On the button, I changed to make a call from a function passing the id of which line should be edited.

Editing the JS

function enviar(row) {
    var id = $('#id_' + row).val();
    var nome = $('#nome_' + row).val();
    var rg = $('#rg_' + row).val();
    var envolvimento = $('#envolvimento_' + row).val();

    $.post("<?php echo base_url(); ?>index.php/sbp/editarEnvolvido",
        {'id': id, 'nome': nome, 'rg': rg, 'envolvimento': envolvimento},
        function (data) {
            alert(data);
    }, "html");
}

In this part, just concatenate the id again on the selector to bring the correct line information to be edited.

I guess that settles it all!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.