Captura de pantalla de la página HTML hasta ahora:
<div> <fieldset> <legend>Work Experience</legend> <p> <label for="occupation">Job Title</label><br> <input type="text" id="occupation" name="occupation"><br> <label for="company">Company Name:</label><br> <input type="text" id="company" name="company"><br> <label for="duties">Duties and Skills Attained:</label><br> <input type="text" id="duties" name="duties"><br> <button type="button" id="generate">Add Work Eperience</button> </p> </fieldset> </div>No estoy seguro de entender completamente, pero los nombres de entrada también admiten matrices. Entonces, lo que podría hacer es algo como esto (asumiendo que desea tener un envío para cada entrada).
<input type="text" id="occupation" name="experience[][occupation]" value="some-previous-occupation"> <input type="text" id="company" name="experience[][company]" value="some-previous-company"> Luego, puede agregar entradas ocultas para realizar un seguimiento de las que ya se enviaron (puede usar un bucle y reemplazar 0 con el índice del bucle)
<input type="hidden" id="occupation" name="experience[0][occupation]"> <input type="hidden" id="company" name="experience[0][company]">Esto luego se enviaría a su back-end de esta manera:
[ 0 => ['occupation' => 'some-previous-occupation', 'company' => 'some-previous-company'] 1 => ['occupation' => 'developer', 'company' => 'stackoverflow'] ]