Posting two variables in one form input through Ajax

Question

Here I load a table with an option to input a quantity.

<?php
while ($row=mysql_fetch_array($select)) 
{
?>

<td><?php echo $row['Size'];?></td>    
<td><input type="text" name="[<?php echo $row['Id'];?>]" id="[<?php echo $row['Id'];?>]"></td>

<?php
}
?>

When submitting the form I want to post all the inputs+ID to the next page through Ajax.

$(document).ready(function() {
    var table = $('#Productslist').DataTable();

    $('button').click( function() {
        var data = table.$('input').serialize();
        $.ajax({
        data: data.substr( 0, 120 ),
        url: 'confirmorder2.php',
        method: 'POST', // or GET
        });
});
    } );

Here I try to get each row where ID=$name and input=$value. If the input is empty they do not get echo out.

<?php
foreach($_POST as $name => $value)
{
if (!empty($value)) { 
  ?>
  <tr>
  <td><?php echo $name;?></td>
  <td><?php echo $value;?></td>
  </tr>
  <?php
  }
}
?>

The only thing I get echo'd on the next page is my token name and token which I have in a hidden input.

***Please [stop using `mysql_*` functions](http://stackoverflow.com/questions/12859942/why-shouldnt-i-use-mysql-functions-in-php).*** [These extensions](http://php.net/manual/en/migration70.removed-exts-sapis.php) have been removed in PHP 7. Learn about [prepared](http://en.wikipedia.org/wiki/Prepared_statement) statements for [PDO](http://php.net/manual/en/pdo.prepared-statements.php) and [MySQLi](http://php.net/manual/en/mysqli.quickstart.prepared-statements.php) and consider using PDO, [it's really pretty easy](http://jayblanchard.net/demystifying_php_pdo.html). — Jay Blanchard, Jul 12 '17 at 18:44
`table.$('input').serialize()` is not valid.... You should have an error in your console. — epascarello, Jul 12 '17 at 18:44
Thank you Jay, I will change my code and look into PDO. Epascarello, I do not get an error in my console from that. I am using DataTables (https://datatables.net/examples/api/form.html) and they use it as an example. — Mille, Jul 12 '17 at 18:55
Crap sorry, missed the data table line. I need more coffee... lol — epascarello, Jul 12 '17 at 18:59
Where is this next page coming from? Not the ajax call. Is there a form submitting at the same time as the ajax when the button is clicked? — James, Jul 12 '17 at 19:02
James, yes... I think this is the case. Is there a way I can send the form and open the next page with Ajax? — Mille, Jul 12 '17 at 19:15
It would make sense to just use a form, if you want another page to load. Ajax is great when you *don't* want another page to load. — James, Jul 12 '17 at 19:18

score 0 · Answer 1 · answered Jul 12 '17 at 18:58

serialize() function is used to serialize all the input values in a form, rather you could use the following code.

    $(document).ready(function() {
    var table = $('#Productslist').DataTable();

    $('button').click( function() {


$("#Productslist tbody tr").each(function(index, el) {
    var input = $(this).children(':nth-child(1)').find('input');
    var data = {};
    data.name = input.value;
    data.id = input.attr('id');
 $.ajax({
        data: data.substr( 0, 120 ),
        url: 'confirmorder2.php',
        method: 'POST',
        success:function(response){
console.log(response);
        } 
        });
});
});
});

Posting two variables in one form input through Ajax

1 Answers1