2

Muy buenas. Sé que este es un tema tratado, pero en mi caso particular no puedo resolverlo. Tengo un formulario que envía múltiples filas a una base de datos. Lo que necesito es que al rellenar uno de los campos manualmente, una columna entera del formulario se rellene con ese valor. El formulario sería algo como:

<form role="form" method="post" action="food.php">
    <div class="row">
      <div class="col-md-3">
    <input type="text" id='food' onchange='add();'>
      </div>

    <div class="row">
      <div class="col-xs-12">
        <table id="production" class="table-bordered">
          <thead>
            <tr>
              <th>Date</th>
              <th>Batch</th>
              <th>Tubs</th>
            </tr>
          </thead>
        <tbody>
<?php while ($r=$query1->fetch_array()):?>
            <tr>

              <td>
              <div class="form-group">
              <input type="date" class="form-control" value="<?php echo date('Y-m-d'); ?>" name="feeddate[]" required />
              </div>
              </td>

              <td>
              <div class="form-group">
              <input type="text" class="form-control" value="<?php echo $r["batchnumber"]; ?>" name="batchnumber[]"  /> 
              </div>
              </td>

              <td>
              <div class="form-group">
              <input type="text" id='showId' class="form-control" name="batchtubs[]" />
              </div>
              </td>

Y para rellenar automáticamente el campo utilicé esto:

<script type="text/javascript">
    function add()
    {      document.getElementById('showId').value=document.getElementById('food').value;
    }
</script>

El problema es que sólo me rellena la primera fila de valores, pero hay más de 60 (el número es variable, según los valores que traiga la consulta).

He probado con otras funciones, como

  <script type="text/javascript">
        function add()
        {
            jsvar=document.getElementById('food').value;
            document.formname.formvar.value = jsvar;
        }

  </script>

    <input id='food' onchange='add();'>

   <form name="formname">
    <input name="formvar" value="">
  </form>

Que me iba bien haciendo pruebas, hasta que la he insertado en el campo td de la tabla, y ya no me devolvía los valores.

También probé con otras ideas, pero sin resultado:

<form name="form" action="" method="post">
  <input type="text" name="subject" id="subject" value="230">

  <input type="text" name="new" id="new" value="<?php echo $POST['subject']; ?>">
  </form>

Tengo una sensación bastante nítida de que estoy haciéndome un lío. ¿Alguna idea para resolverlo? ¡Gracias! Alex.

2
  • ¿Cual es el campo que rellenas manualmente? ¿cuando tiene que rellenarse toda la columna, despues de que se agregan las filas o al mismo tiempo? ¿Podrías editar tu pregunta para agregar esta informacion? el 1 ago. 2017 a las 14:28
  • Estas usando el mismo id en todas las filas. Debes usar un clase en lugar de un id. Otra cosa, ¿ por que no usas jQuery ?, te vas a ahorrar muchisimo trabajo. el 1 ago. 2017 a las 14:32

2 respuestas 2

5

Asigna una clase al input, busca los input por la clase y luego le asignas el valor a cada uno.

Por ejemplo:

function add()
{
  var elements = document.querySelectorAll(".entrada-usuario");
  var valor = document.getElementById('food').value;

  for(var i = 0; i < elements.length;i++)
  {
     elements[i].value = valor;
  }
}
<input type="text" placeholder="Escriba aqui..." id='food' onkeyup='add();'>

<div>
<input type="text" id='showId' class="form-control entrada-usuario" name="batchtubs[]" />

</div>
<div>
<input type="text" id='showId' class="form-control entrada-usuario" name="batchtubs[]" />

</div>
<div>
<input type="text" id='showId' class="form-control entrada-usuario" name="batchtubs[]" />

</div>

Recuerda que cuando asignas varios elementos con el mismo id y lo buscas con javascript, siempre te retornara el ultimo.

2

Un consejo debes ir probando paso por paso antes de pasarlo al front-end, y luego entonces lo colocas en el lugar correspondiente.

Por ejemplo, yo envio un id:

    <tbody id="mainElement">
        <?php 

            $stmt = $pdo->prepare('SELECT * FROM  users WHERE id=:id_login AND estado =1');
            $stmt->bindValue(':id_login', $_GET['id']);
            $stmt->execute();

        ?>

        <? while($user =  $stmt->fetch(PDO::FETCH_OBJ)): ?>

            <tr class='remover-<?=$user->id?>'>
                    <td>
                     <select name='monto[]' id='monto' class='tasa form-control' >
                    <option value="<?=$user->moneda?>" ><?=$user->moneda?></option>
                    </select>
                        </td>
                                <td>
                                 <input type='text' name='tasa[]' id="tasa"  style='width:100px;' class='form-control' placeholder='$0.00' value="<?=$user->tasa ?>">
                                </td>
                                <td>
                                <a href='#' onclick='delete(<?=$user->id?>);' class='removeTr btn btn-danger btn-sm'><i class='fa  fa-trash-o'></i></a>
                                </td>
                            </tr>
                        <? endwhile; ?>

Y me rellana los campos, pero antes yo verifique que llegaran los datos correctamente.

Para eliminar los elementos.

 function delete(data) {
    $('.remover-' + data).remove();
}

Esto sería si solo es PHP.

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.