3

I have a huge form which has a table in it. I add lines of this table with jQuery when the user press some button and try to catch all theses values in PHP

But I can't get other values than the first line of the table!

Got

Undefined index: categorie#2

when I'm trying to get it by $_POST['categorie#2']

HTML looks like this:

<form> ...[some working inputs] <table id="matos" class="table table-responsive synthese"> <thead> <tr> <th>Matériel</th> <th>Fournisseur</th> <th>Numéro de série</th> <th>Catégorie</th> <th>Description</th> <th>Date d'achat</th> <th>Etat</th> </tr> </thead> <tbody> <tr class="" id="ligne#1"> <td><input type="text" name="materiel#1" id="materiel#1" class="form-control" value=""></td> <td> <select name="fournisseur#1" id="fournisseur#1" class="form-control" value=""> <?php $list = listing_fournisseurs(); foreach ($list as $key => $value) { echo '<option value='.$key.'>'.$value.'</option>'; } ?> </select> </td> <td><input type="text" name="num_serie#1" id="num_serie#1" class="form-control" value=""></td> <td> <select name="categorie#1" id="categorie#1" class="form-control" value=""> <?php $list = listing_categories(); foreach ($list as $key => $value) { echo ' <option value='.$key.'>'.$value.'</option>'; } ?> </select> </td> <td><input type="text" name="description_materiel#1" id="description_materiel#1" class="form-control" value=""></td> <td><input type="text" name="buy_date#1" id="buy_date#1" class="date form-control" value=""></td> <td> <select name="etat#1" id="etat#1" class="form-control" value=""> <?php $list = listing_etats(); foreach ($list as $key => $value) { echo ' <option value='.$key.'>'.$value.'</option>'; } ?> </select> </td> </tr> </tbody> </table>

How I add a line in jQuery?

var num= parseInt($('#matos tr:last').prop("id").split('#')[1])+1; $('#matos tr:last').after('<tr id="ligne#'+num+'">'+ '<td><input type="text" name="materiel#'+num+'" id="materiel#'+num+'" class="form-control" value=""></td>'+ '<td><select name="fournisseur#'+num+'" id="fournisseur#'+num+'" class="form-control" value="">'+ opt_fournisseurs+ '</select></td>'+ '<td><input type="text" name="num_serie#'+num+'" id="num_serie#'+num+'" class="form-control" value=""></td>'+ '<td><select name="categorie#'+num+'" id="categorie#'+num+'" class="form-control" value="">'+ opt_categories+ '</select></td><td><input type="text" name="description_materiel#'+num+'" id="description_materiel#'+num+'" class="form-control" value=""></td>'+ '<td><input type="text" name="buy_date#'+num+'" id="buy_date#'+num+'" class="date form-control" value=""></td>'+ '<td><select name="etat#1" id="etat#1" class="form-control" value="">'+ opt_states+ '</select></td></tr>'); $('#nbLignes').val(num);

And well in PHP I'm trying:

$_POST['materiel#2'] // doesn't work $_POST['materiel#1'] // works ! ( because first line ! )

I've read some issues that form don't work if they're not into table tr td ... But in my case they are ... What's wrong ?

Improve this question
12
  • 1
    If you inspect the name of materiel input box added by jquery than what you get ?? Commented May 22, 2015 at 8:06
  • 1
    What happens when you dump (var_dump()) the values in $_POST? Do you see any other categories or values that aren't in there by default? Commented May 22, 2015 at 8:06
  • print your $_POST, and you would get an idea, what is wrong. Commented May 22, 2015 at 8:09
  • Yeah i've got all the '#1' but i got the error Undefined index: [nameOfInput]#NumberOfLine for other lines... As if data won't send Commented May 22, 2015 at 8:19
  • 1
    @Seba99 The advantage is that you don't have to keep track of numbers (categorie#1, materiel#2) etc. It just turns everything with that name in to an array with indices. Take a look at this answer for a clear usage example: stackoverflow.com/a/1010970/1294864 Commented May 22, 2015 at 8:49

3 Answers 3

Reset to default
1

My bad here ! I just messed up with my DOM-structure ... You shouldn't close a div, that you oppened before your <form>, before the end of your </form> that's why !

Won't work :

<div id="some_div"> <form> [Some inputs...] </div><!-- /some_div --> </form>

Should work :

<div id="some_div"> <form> [Some inputs...] </form> </div><!-- /some_div -->

Seems obvious but not when you have a very large DOM ;)

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

You will make your life ALOT easier, if you use this naming convention <input name="category[]" /> instead of <input name="category#1" />

That way you will get your variables in an array on the PHP end, which makes traversing the data ALOT easier!

eg:

<?php foreach($_POST['categories'] as $num => $value){ } ?>
Improve this answer

1 Comment

Yup that's what @Bono said in the coments but isn't the true problem here, good advice anyway :)
0 
var opt_fournisseurs = '<option value="gg">gg</option><option value="dd">dd</option>'; var opt_categories = '<option value="ss">ss</option><option value="aa">aa</option>'; var opt_states = '<option value="ww">ww</option><option value="ee">ee</option>'; var num= parseInt($('#matos tr:last').prop("id").split('#')[1])+1; $('#matos tr:last').after('<tr id="ligne#'+num+'">'+ '<td><input type="text" name="materiel#'+num+'" id="materiel#'+num+'" class="form-control" value=""></td>'+ '<td><select name="fournisseur#'+num+'" id="fournisseur#'+num+'" class="form-control" value="">'+ opt_fournisseurs+ '</select></td>'+ '<td><input type="text" name="num_serie#'+num+'" id="num_serie#'+num+'" class="form-control" value=""></td>'+ '<td><select name="categorie#'+num+'" id="categorie#'+num+'" class="form-control" value="">'+ opt_categories+ '</select></td><td><input type="text" name="description_materiel#'+num+'" id="description_materiel#'+num+'" class="form-control" value=""></td>'+ '<td><input type="text" name="buy_date#'+num+'" id="buy_date#'+num+'" class="date form-control" value=""></td>'+ '<td><select name="etat#1" id="etat#1" class="form-control" value="">'+ opt_states+ '</select></td></tr>'); $('#nbLignes').val(num); 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <?php var_dump($_POST); ?> <form method="post"> <table id="matos" class="table table-responsive synthese"> <thead> <tr> <th>Matériel</th> <th>Fournisseur</th> <th>Numéro de série</th> <th>Catégorie</th> <th>Description</th> <th>Date d'achat</th> <th>Etat</th> </tr> </thead> <tbody> <tr class="" id="ligne#1"> <td><input type="text" name="materiel#1" id="materiel#1" class="form-control" value=""></td> <td> <select name="fournisseur#1" id="fournisseur#1" class="form-control" value=""> <option value="one">one</option> <option value="two">two</option> </select> </td> <td><input type="text" name="num_serie#1" id="num_serie#1" class="form-control" value=""></td> <td> <select name="categorie#1" id="categorie#1" class="form-control" value=""> <option value="1">1</option> <option value="2">2</option> </select> </td> <td><input type="text" name="description_materiel#1" id="description_materiel#1" class="form-control" value=""></td> <td><input type="text" name="buy_date#1" id="buy_date#1" class="date form-control" value=""></td> <td> <select name="etat#1" id="etat#1" class="form-control" value=""> <option value="1a">1a</option> <option value="2a">2a</option> </select> </td> </tr> </tbody> </table> <input type="submit" name="txtsubmit" value="submit"/>

This is a sample created from the code you have provided, which was working for me.

Improve this answer

1 Comment

Well it's work for me too ... x) But my DOM is a little bit more complicated ... I would like to post my whole source but is there a way to get sources AFTER some JS operation ( like new lines in tab ) because with CTRL+U I just get what's before js action ... And through the chrome inspector I get a lot of ::after or ::after should I post my DOM anyway ?

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.