How to repeat a part of html code of bootstrap style to display entries from database?

Question

0.00/5 (No votes)

See more:

I have this code which retrieves information from database, i saved it as .php I need to repeat a part of code which displays the books in database nicely

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Timeline </title>

    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" href="font-awesome/css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="css/local.css" />

    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script> 
	

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

	

      
</head>
<body>

 
    <div id="wrapper">
        <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="index.php">V-cart</a>
            </div>
            <div class="collapse navbar-collapse navbar-ex1-collapse">
                <ul class="nav navbar-nav side-nav">
                    <li><a href="timeline.php"></a></li>
                    <li><a href="post.php">^__i class="fa fa-font"__^</i__^ Post Ad</a></li>
                    
                </ul>
                <ul class="nav navbar-nav navbar-right navbar-user">
                    <li class="dropdown messages-dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">^__i class="fa fa-envelope"> Messages <span class="badge"></span> ^__b class="caret"></a>
                        <ul class="dropdown-menu">
                            <li class="dropdown-header">No Messages</li>
                            <li class="message-preview">
                                <a href="#">
                                    <span class="avatar">^__i class="fa fa-bell"></span>
                                    <span class="message">Security alert</span>
                                </a>
                            </li>
                            <li class="divider"></li>
                            <li class="message-preview">
                                <a href="#">
                                    <span class="avatar">^__i class="fa fa-bell"></span>
                                    <span class="message">Security alert</span>
                                </a>
                            </li>
                            <li class="divider"></li>
                            <li><a href="#">Go to Inbox <span class="badge"></span></a></li>
                        </ul>
                    </li>
                    <li class="dropdown user-dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user"></i> User Name<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="profileme.php"><i class="fa fa-user"></i> Profile</a></li>
                            <li><a href="#"><i class="fa fa-gear"></i> Settings</a></li>
                            <li class="divider"></li>
                            <li><a href="index.php"><i class="fa fa-power-off"></i> Log Out</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </nav>

         <hr />
        <div class="container">
            <div class="page-header">
                <h1 id="timeline">User Events</h1>
            </div>

<?php

define('DB_NAME', 'userdb');
define('DB_USER', 'root');
define('DB_PASSWORD', '');
define('DB_HOST', '127.0.0.1');

$link = mysql_connect(DB_HOST, DB_USER, DB_PASSWORD);

if (!$link) {
	die('Could not connect: ' . mysql_error());
}

$db_selected = mysql_select_db("userdb");

if (!$db_selected) {
	die('Can\'t use ' . DB_NAME . ': ' . mysql_error());
}


$sql = "SELECT * FROM postad";
$myData = mysql_query($sql,$link);
$count= mysql_num_rows($myData);


$record= mysql_fetch_array($myData);
# $record = mysql_fetch_assoc($myData);


mysql_close();
?>
			
			<ul class="timeline">
			
			<!-- Repeat this code from here -->
    	
				<li>
                    <div class="timeline-badge info"><i class="fa fa-unlock"></i></div>
                    <div class="timeline-panel">
                        <div class="timeline-heading">
                            <h4 class="timeline-title"><?php echo $record['title'];  ?></h4>                            
                            <span><i class="fa fa-clock-o fa-2x"></i></span>
                            <hr />
                        </div>
                        <div class="timeline-body">
Author : <?php echo $record['author'];  ?> <br>
Semester : <?php echo $record['semester'];  ?> <br>
Details: <?php echo $record['description'];  ?> <br>

                        </div>
                    </div>
                </li>
			
			<!-- to here -->
				
              <!--  <li class="timeline-inverted">
                    <div class="timeline-badge success"><i class="fa fa-unlock"></i></div>
                    <div class="timeline-panel">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Book 2</h4>
                            <span><i class="fa fa-clock-o fa-2x"></i> 57 minutes ago</span>
                            <hr />
                        </div>
                        <div class="timeline-body">
                             <p>Details</p>
                        </div>
                    </div>
                </li> -->
                
            </ul>
			
        </div> 
    </div>

</body>
</html>

How to repeat a part of html code of bootstrap style to display entries from database?

Add your solution here

Preview 0

How to repeat a part of html code of bootstrap style to display entries from database?

Add your solution here

Preview 0

Existing Members

...or Join us