Creating a html table with javascript by entering mysql values

Question

The question might not really be clear because I could not think of something that could suit my problem, anyway, I am importing some mysql values using php and creating a html table using javascript, however I am having problems with the PHP as well as Javascript part, Also if anyone could tell me how I could just import values from MYSQL database and make a html table with it (That's basically what I am trying to do)

1.) PHP is not importing values from MYSQL correctly

2.) On console it says: "Uncaught SyntaxError: Unexpected token ILLEGAL"

The following is my code,

<?php
$con = mysqli_connect("localhost","root","","human_information");
$result = mysqli_query($con,"SELECT * FROM basic_human_info");
$rows = mysqli_num_rows($result);
$columns = mysqli_num_fields($result);
 ?>

<body>
    <script type="text/javascript">
        function createTable(){
            var tBody = document.getElementsByTagName("body")[0];
            var table = document.createElement("table");
            table.style.border=1;
            table.style.width='50%';
            table.setAttribute('border',1);
            var rows = "<?php echo $rows; ?>";
            var columns = "<?php echo $columns ?>";
            for(var i=0;i<columns;i++){
                var tr = document.createElement("tr");
                for(var j=0;j<rows;j++){
                    var td = document.createElement("td");
                    td.appendChild(document.createTextNode("
                    <?php
                    $sql = mysqli_query($con,"SELECT 'First Name' FROM basic_human_info");
                    echo mysqli_fetch_assoc($sql);
                    ?>
                    "));
                    tr.appendChild(td);
                }
                table.appendChild(tr);
            }
            tBody.appendChild(table);
        }
        createTable();
    </script>
</body>

You can directly add value using PHP in table, is there is any compulsion for using javascript? — Rohit Nigam
– Rohit Nigam, Commented Apr 5, 2014 at 8:40
I think its better if you echo "<tr>"'s with php code. And iterate results with foreach. — Dan Jay
– Dan Jay, Commented Apr 5, 2014 at 8:42
@RohitNigam I need to add some styling, dynamic content and other objects/elements so yeah I have to use Javascript, if I can directly do it with PHP, then I will try that as well, but how will I do that with PHP? — Talha Tanveer
– Talha Tanveer, Commented Apr 5, 2014 at 8:42

akirk · Accepted Answer · 2014-04-05 08:43:08Z

1

You are outputting an array with echo (echo mysqli_fetch_assoc($sql);) which will just print Array in the middle of the Javascript. That leads to the Uncaught SyntaxError.

But the question rather is: Why use Javascript? Try it with HTML first until you get the PHP right, then do what ever you are planning to do with Javascript.

answered Apr 5, 2014 at 8:43

akirk

6,8972 gold badges37 silver badges59 bronze badges

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

3 Comments

Talha Tanveer Over a year ago

I need to add some styling, dynamic content and other objects/elements so yeah I have to use Javascript. How do I fix the array problem?

akirk Over a year ago

You should take this approach: print the table as HTML and then use Javascript to do all the dynamic stuff. Keyword: Progressive Enhancement

Talha Tanveer Over a year ago

Thanks a lot for the link and the solution :)

Rohit Nigam · Accepted Answer · 2014-04-05 08:45:12Z

1

Like this you can try in php directly

while ($row = mysqli_fetch_array($stmt)) {
    echo "<tr>";
    echo "<td>" . $row["aid"] . "</td>";
    echo "<td>" . $row["aname"] . "</td>";
    echo "</tr>";
}

answered Apr 5, 2014 at 8:45

Rohit Nigam

7081 gold badge8 silver badges23 bronze badges

Collectives™ on Stack Overflow

Creating a html table with javascript by entering mysql values

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related