Putting PHP via Ajax to edit input fields

0

I have a screen of product counts in which is a page with several inputs with values in it, however I am having problems updating the value contained in the input, since it only changes the first line, could anyone help me with that, I've been breaking up with this for a week, thank you.

HTML

<form id="form" method="post" action="">
            <table class="table table-bordered table-striped js-dataTable-full">
              <thead>
                <tr>
                  <th>ID</th>
                  <th>Cód. Produto</th>
                  <th>Descrição</th>
                  <th>Qtd Contada</th>
                  <th>Ação</th>
                </tr>
              </thead>
              <tbody>
                <?php

                if(isset($lista)){
                  foreach($lista->result_array() as $row){ ?>

                      <?php if($row['con_editado'] == 1) {?> <tr style="background-color: #ffff99;"><?php } ?>
                      <?php if($row['con_editado'] == 0) {?> <tr><?php } ?>
                      <td><input type="text" readonly style="border:none;" value="<?php echo $row['con_id']; ?>" name="textId" id="textId"/></td>
                      <td><?php echo $row['pro_cod_pro_cli']; ?></td>
                      <td><?php echo $row['pro_descricao']; ?></td>
                      <td><input type="text" value="<?php echo $row['con_quantidade']; ?>" name="textQtd" id="textQtd"/></td>
                      <td class="text-center"><button class="btn btn-sm btn-primary" type="submit" >Salvar</button></td>
                    </tr>

                  <?php }
                }?>
              </tbody>
            </table>
            </form>

AJAX

<script>
        $(document).ready(function(){
            $("#form").on("submit", function(e){            
              $.ajax({
                url: "<?php echo base_url(); ?>index.php/editarcontagem/updateContagem",
                type: "POST",
                dataType: "html",               
                data: {
                 textId: $('#textId').val(),
                 textQtd: $('#textQtd').val(),

                },
                success: function(data) {
                  $('#textId').html(data);
                  $('#textQtd').html(data);
                }
              });
            });
        }); 
    </script>
    
asked by anonymous 16.05.2018 / 21:40

1 answer

0

The problem is that all Inputs are exiting with the same id: id="textId"

The ID must be a unique identifier value.

  

The value of this attribute should not contain any gaps (spaces, tabs   etc.). Browsers treat inappropriate IDs that contain gaps like   if the gaps were part of the ID. In contrast to the class attribute,   which allows multiple values separated by space, the elements can   have only a single ID.

More details

    
16.05.2018 / 22:43