PHP - Populate List With MySQLi

Submitted by: 
Visitors have accessed this post 171 times.

In this tutorial we will create a Populate List With MySQLi using PHP. This code will display MySQLi data as a HTML list. The code use MySQLi SELECT query that will display the MySQLi row as a html list using mysqli_fetch_array(). This a user-friendly program feel free to modify and use it to your system.

We will be using PHP as a scripting language that interepret in the webserver such as xamp, wamp, etc. It is widely use by modern website application to handle and protect user confidential information.

Getting Started:

First you have to download & install XAMPP or any local server that run PHP scripts. Here's the link for XAMPP server

And this is the link for the jquery that i used in this tutorial

Lastly, this is the link for the bootstrap that i used for the layout design

Creating Database

Open your database web server then create a database name in it db_list, after that click Import then locate the database file inside the folder of the application then click ok.

Creating the database connection

Open your any kind of text editor(notepad++, etc..). Then just copy/paste the code below then name it conn.php.

  1. <?php
  2. $conn=mysqli_connect("localhost", "root", "", "db_list");
  4. if(!$conn){
  5. die("Error: Failed to connect to database!");
  6. }
  7. ?>

Creating The Interface

This is where we will create a simple form for our application. To create the forms simply copy and write it into your text editor, then save it as index.php.

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1" />
  5. <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
  6. </head>
  7. <body>
  8. <nav class="navbar navbar-default">
  9. <div class="container-fluid">
  10. <a class="navbar-brand" href="<a href="">Sourcecodester</a>
  11. " rel="nofollow">">Sourcecodester</a>
  12. </a> <div>
  13. </nav>
  14. <div class="col-md-3"></div>
  15. <div class="col-md-6 well">
  16. <h3 class="text-primary">PHP - Populate List With MySQLi</h3>
  17. <hr style="border-top:1px dotted #ccc;">
  18. <div class="col-md-3">
  19. <form method="POST" action="add.php">
  20. <div class="form-group">
  21. <label>Enter a movie title</label>
  22. <input type="text" name="movie" class="form-control" required="required"/>
  23. </div>
  24. <center><button class="btn btn-primary" name="add">Add</button></center>
  25. </form>
  26. </div>
  27. <div class="col-md-9">
  28. <h2>MY MOVIE LIST <?php echo date("Y")?></h2>
  29. <ul>
  30. <?php
  31. require'conn.php';
  33. $query=mysqli_query($conn, "SELECT * FROM `movie`") or die(mysqli_error());
  34. while($fetch=mysqli_fetch_array($query)){
  35. echo "<li>".$fetch['movie_title']."</li>";
  36. }
  37. ?>
  38. </ul>
  39. </div>
  40. </div>
  41. </body>
  42. </html>

Creating the Main Function

This code contains the main function of the application. This code will display the MySQLi data as a list when the button is clicked. To make this just copy and write these block of codes below inside the text editor, then save it as add.php

  1. <?php
  2. require_once'conn.php';
  4. if(ISSET($_POST['add'])){
  5. $movie=$_POST['movie'];
  7. mysqli_query($conn, "INSERT INTO `movie` VALUES('', '$movie')") or die(mysqli_error());
  9. header('location: index.php');
  10. }
  11. ?>

There you have it we successfully created Populate List With MySQLi using PHP. I hope that this simple tutorial help you to what you are looking for. For more updates and tutorials just kindly visit this site. Enjoy Coding!

Add new comment

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • You may insert videos with [video:URL]
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd> <table> <tr> <td> <th> <img> <h1> <h2> <h3> <iframe> [video]
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <asp>, <c>, <cpp>, <csharp>, <css>, <html4strict>, <java>, <javascript>, <mysql>, <php>, <python>, <sql>, <vb>, <vbnet>. The supported tag styles are: <foo>, [foo].
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.