-2

I am totally new to web development. I am doing a personal project for learning purpose.

I have a php page, which query my database and return the data. My query is : SELECT * FROM myTable ORDER BY id;

That works fine from a SQL GUI tool.

When I load my page, the data is not ordered by the ID. Each time I refresh the page, the order is randomly changed.

My HTML header section

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>
<script>window.jQuery || document.write('<script src="/js/jquery-1.12.4.min.js">\x3C/script>')</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

My loadData.php page

try {
    $connection = new PDO($dsn, $username, $password, $options);
    $sqlData = "SELECT * FROM cc_data_tbl where cc_uuid = '" . $_GET['load_uuid'];
    $statement = $connection->query($sqlData);        
    $results = $statement->fetchAll(PDO::FETCH_ASSOC);

    if ($statement->rowCount() == 0){
        echo "No Data";
    } else { ?>
        <div class="wrapper">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12">
                        <div class="page-header clearfix">
                            <?php
                                echo "<table class='table table-bordered table-striped' id=\"transactionList\">";
                                echo "<thead>";
                                echo "<tr>";
                                echo "<th>Transaction Date</th>";
                                echo "<th>Listing Date</th>";
                                echo "<th>Description</th>";
                                echo "<th>Amount</th>";
                                echo "<th>Category</th>";
                                echo "<th>Category Type</th>";
                                echo "</tr>";
                                echo "</thead>";
                                echo "<tbody>";
                                foreach($results as $row){
                                    echo "<tr>";
                                    echo "<td>" . $row['cc_transac_date'] . "</td>";
                                    echo "<td>" . $row['cc_listing_date'] . "</td>";
                                    echo "<td>" . $row['cc_description'] . "</td>";
                                    echo "<td>" . $row['cc_amount'] . "</td>";
                                    echo "<td>" . $row['cc_category'] . "</td>";
                                    echo "<td>" . $row["cc_category_type"] . "</td>";
                                    echo "</tr>";
                                }
                                echo "</tbody>";                            
                                echo "</table>";
                            ?>
                        </div>
                    </div>        
                </div>
            </div>
        </div>
    <?php }
    } catch (PDOException $error) {
        echo $error -> getMessage();
} 

I was expecting to have my data sorted by ID, which is not the case. This is a rather really basic SQL query... so I assume there's something that I really do not understand with HTML / PHP / Bootstrap as all these things are new to me.

Hunkerjr
  • 35
  • 5
  • 2
    You don't seem to have an `order` statement in your sql query in your loadData.php. You may also want to read this: https://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php – Pete Jul 12 '19 at 13:55
  • Hi Pete, Ahah! My mistake, was playing around trying to understand why the order by doesn't work and did pay attention when posting. The SQL query is : $sqlData = "SELECT * FROM cc_data_tbl where cc_uuid = '" . $_GET['load_uuid'] . " ORDER BY cc_id"; – Hunkerjr Jul 12 '19 at 14:08
  • and there definately is a `cc_id` column as you seem to be doing a where on `cc_uuid` (seems weird there are 2 id fields) – Pete Jul 12 '19 at 14:16
  • Hi Dharman, Yes I am aware. I will look into it later, once I progress in the learning process :) Thank you for pointing it out. – Hunkerjr Jul 12 '19 at 14:58

1 Answers1

0

if your problem still continue , please check your table class("table table-bordered table-striped") . Sorting variables in table class . I will give you example . I hope it helps for you.

$('#simple-table').DataTable({
            "order": [[ 0, "desc" ]],
            "autoWidth": true,
            "language": {
                "url": "//cdn.datatables.net/plug-ins/1.10.16/i18n/Turkish.json"
            }
        });
  • Hi Yasin, where should I copy this code to try? I know close to nothing to web stuff. – Hunkerjr Jul 12 '19 at 14:59
  • Ah, I think I figured it out. I have to extend Bootstrap stuff right? I created a new js file (called dt_bootstrap.js) in which I added the above, slightly modified code (adjusted table name and only used the order line). It seems to work fine !! Thanks Alot! – Hunkerjr Jul 12 '19 at 18:05
  • Hi @Yassin, Unfortunately, I think I was too much hyped. After some testing, I realized that it doesn't work :( I must have done the wrong thing. – Hunkerjr Jul 12 '19 at 18:31
  • In the end, I upgraded to Bootstrap 4.2.1 and rework the pages. But I lost glyphicons! I moved to Font Awsome and now everything is as expected. – Hunkerjr Jul 12 '19 at 20:27
  • Hi , hunkerjr , I'm sorry for the late reply. Did you solve your problem ? – Yasin Bellidinç Jul 13 '19 at 17:44
  • Hi Yasin! Ya, I moved to Bootstrap 4.2 and redesign my stuff. But for my own knowledge, where would I have copy/edited your example to try it out? – Hunkerjr Jul 16 '19 at 01:36
  • Your table class is class='table table-bordered table-striped' . You should check where this class.And adapting this example there – Yasin Bellidinç Jul 16 '19 at 14:44