send jQuery generated table to another php page

Question

In my project (some kind of online game store), i have a jQuery generated table from click on original table row. The original table is populated from mysql database. On submit i need to send that generated table to another php page. I'm quite new with it and so far this is my code:

on php_first.php

generated table

  <form  action="php_second.php" id ="form_send" name ="form_send1" method="POST">
<div>
    <table id="generated_table" style="display:none" name ="generated_table1">
        <tr><th>Game</th><th>Platform</th> <th>Genre</th> <th>Price</th><tr>

                   // generated rows here

        </table>
        <input type="submit" value="Confirm"  id="btnOrder" style="display:none"></input>
</div>
</form>

generated rows

$(document).ready(function(){
    $('#original_table tbody tr').click(function(){

        var data = $(this).children("td").map(function(){
            return $(this).text();
        }).get();


        var row= '<tr name ="new_row"><td name = "game">' + data[0] + '</td><td name = "platform">' + data[1] + 
                 '</td><td name = "genre">' + data[2] + '</td><td name = "price">' + data[3] + 
                 '<button type="button" onclick="remove(this)" class ="btn_remove">Remove</button>' +'</td></tr>';


         $("#generated_table tbody").append(row);
         $('#generated_table').show();
         $('#btnConfirm').show();


});

ajax post to php_second.php

$('#btnOrder').click(function(){

    var table= $('#generated_table');

        $.ajax({
            url: 'php_second.php',
            type: 'POST',
            data: {data: table},
            async: false, 
            success: function(data){

                alert(data);
            }    
        });

However, ajax dosen't do alert(data) so i asume this is the problem but i cant determine it.

and on php_second.php

<table id="table_order" name = "table_order1" style="display:show">

<?php
if(isset($_POST['generated_table'])){               
        $table= $_POST['generated_table'];

        echo $table;    

    }
?>  
</table>

The problem is that i cannot post table data to another php (and print that table on other php when redirected). Tried to use ajax to send row data on row click, or passing div where table is but nothing. It shows no errors but no data is passed.

This is my first question so it is possible that i missed out some details to make the problem more clear. Thanks!

EDIT

I've tried Kalaikumar Thangasamy's code and ajax is working fine now, but the problem is on other php page.

<?php 

        if(isset($_POST['data'])){

            $table = $_POST['data'];
            echo $table;
        }
        else {
            echo "None selected";                       
        }

?>

The $_POST['data'] or any other parameter from first php is always null.

You might need to add .html(). Otherwise, you are attempting to send a jQuery object. var table= $('#generated_table').html(); — Gordon Kushner
– Gordon Kushner, Commented Jan 11, 2018 at 15:16
Thx for the answer! But still, after correcting that error the same problem — gospodin66
– gospodin66, Commented Jan 11, 2018 at 15:48
Things to look for; 1. is the AJAX submit failing? 2. is your PHP page having trouble with the data? I can't really be of much more help. But you should see what's being sent and received. If you use Chrome see this: superuser.com/questions/614599/network-monitor-for-webdeveloper Hope this helps. — Gordon Kushner
– Gordon Kushner, Commented Jan 11, 2018 at 16:03
Thx Kalaikumar Thangasamy, ajax works fine and sends data as intended. But the problem is on the other php page where $_POST['data'] has no values. The php code is posted in edit and i use firefox. — gospodin66
– gospodin66, Commented Jan 12, 2018 at 11:42

Kalaikumar Thangasamy · Accepted Answer · 2018-01-11 16:08:02Z

1

Change data: {data: table} to data: {'generated_table': escape(table)}. Posting data as but referring post data in $_POST['generated_table']. You suppose to be used $_POST['data']. Try this

var table= $('#generated_table').html();

        $.ajax({
            url: 'php_second.php',
            type: 'POST',
            data: {'generated_table': escape(table)},
            async: false, 
            success: function(data){

                alert(data);
            }    
        });

answered Jan 11, 2018 at 16:08

Kalaikumar Thangasamy

5642 silver badges8 bronze badges

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

Collectives™ on Stack Overflow

send jQuery generated table to another php page

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related