How to add several records at once with php and javascript

Question

How to add several records at once with php and javascript

Navigation

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

0

I have knowledge in CRUD (Create, Read, Update and Delete) of MySQL PHP but in a last project of warehouse I wanted to make a form that the more inputs are requested, more rows of form can be added, but this I do not know how to add a id or name to receive in the php without problems.

This is the script method that I use to add new rows of fields:

<script type="text/javascript">
    function add(){
var elemento = document.createElement("li"), contenido = document.createTextNode("Nueva Lista");
    elemento.appendChild(contenido);

var padre = document.getElementsByTagName("li")[0].parentNode;
padre.appendChild(elemento);
}

function add2(){
var fila = document.createElement("tr"), 
celda2 = document.createElement("td"),
celda3 = document.createElement("td"),
celda4 = document.createElement("td");

var text2 = document.createElement("input");
var text3 = document.createElement("input");
var text4 = document.createElement("input");

    celda2.appendChild(text2);
    celda3.appendChild(text3);
    celda4.appendChild(text4);

    fila.appendChild(celda2);
    fila.appendChild(celda3);
    fila.appendChild(celda4);


var tabla = document.getElementsByTagName("tr")[0].parentNode;
tabla.appendChild(fila);

}

</script>

Someone could make a simple example with a single field by adding it and that in a simple database they receive this data together without problems.

Thanks in advance.

mysql javascript jquery php insert

asked by Starking Elyos 31.01.2018 в 04:24

source

2 answers

Stored procedure to delete data in referenced tables problems with .js function in form

score 1 · Answer 1

$(function(){
	$("#agrega").click(function(){
  	var item = '
    	<tr>
      	<td><input type="text" name="nombre[]" placeholder="Nombre"/></td>
        <td><input type="text" name="cedula[]" placeholder="Cédula"/></td>
      </tr>
    ';
    $("#lista").append(item)
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="agrega">
Agregar
</button>
<table>
  <thead>
    <th>Nombre</th>
    <th>cedula</th>
  </thead>
  <tbody id="lista">
  </tbody>
</table>

Try something like this:

$(function(){
    $("#agrega").click(function(){
    var item = '
        <tr>
        <td><input type="text" name="nombre[]" placeholder="Nombre"/></td>
        <td><input type="text" name="cedula[]" placeholder="Cédula"/></td>
      </tr>
    ';
    $("#lista").append(item)
  })
})

As you see in the example, I am adding lines to a table with two text fields to be filled, in the names of the fields I use square brackets to indicate to my php file receiver that it is an arrangement what is to come, by example:

for($i=0; $i<count($_POST['nombre']); $i++){
    $nombre = $_POST['nombre'][$i];
    $cedula = $_POST['cedula'][$i];
    $a = $this->db->query("INSERT INTO tabla (nombre, cedula) VALUES ('$nombre','$cedula')");
    //Esto va a realizar una inserción en la base de datos por cada fila del array que llega desde mi formulario
}

score 0 · Answer 2

To add a name to your new input elements you can add it directly once created as follows:

var text2 = document.createElement("input");
text2.name = "nuevoname";

If what you want is that in all input arrive at the side of the server grouped in a Array you can use the following nomenclature:

text2.name = "nuevoname[x]";

Where x is the index of your input . This can be omitted if you want to have a single group ( nuevoname[] ) or include the levels you need ( nuevoname[tr1][] ).