Bootstrap 4 Image product didn't line up properly - php

I'm tryin to make a simple online shopping page for my PHP training.
But, I'm kinda stuck in the HTML part where using bootstrap didn't make
something more simpler.
The result of the code makes my product line up vertically, and what I want to with it is to make it line up horizontally.
Code :
<div class="container">
<?php
$connect = mysqli_connect('localhost', 'root', '', 'cart');
$query = 'SELECT * FROM products ORDER by id ASC';
$result = mysqli_query($connect, $query);
if ($result):
if (mysqli_num_rows($result)>0):
while ($product = mysqli_fetch_assoc($result)):
//print_r($product);
?>
<div class="col-sm-4">
<form class="" action="welcome.php?action=add&id=<?php echo $product['id'] ?>" method="post">
<div class="products">
<img src="<?php echo $product['image']; ?>" class="img-fluid text-center" />
<h4 class="text-info"><?php echo $product['name']; ?></h4>
<h4>$ <?php echo $product['price']; ?></h4>
<input type="text" name="quantity" class="form-control" value="1" />
<input type="hidden" name="name" value="<?php echo $product['name'] ?>" />
<input type="hidden" name="price" value="<?php echo $product['price']; ?>" />
<button type="submit" name="add_to_cart" class="btn btn-outline-primary">Add to Cart</button>
</div>
</form>
</div>
<?php
endwhile;
endif;
endif;
?>

For bootstrap grid system to work , the tags must be in following order:
<div class="container">
<div class="row">
<div class="col-md-6">
One of two columns
</div>
<div class="col-md-6">
One of two columns
</div>
</div>
</div>

Related

Only one radio buttons being selected out of four questions

I want to make a list of four questions and four options for each question. I have successfully fetched the questions with foreach loop but, radio buttons do not seem to work with foreach loop.
Eg: I chose one answer form the first question and jump to second, but if I select an answer for the second question, the selected option of the first questions gets deselected. I have tried changing values of options, that did not work, I tried using for loop inside the foreach loop and even that did not work.
Following is my code:
<form method="post" action="process/quiz.php">
<?php
$quizList = $quiz->getQuiz(4);
if($quizList){
foreach($quizList as $list){
?>
<div class="row rowpadding">
<div class="col-md-8 col-md-offset-2" id="panel1">
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<?php echo $list->title; ?>
</h5>
</div>
<div class="panel-body two-col">
<div class="row">
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-1" name="ans1" value="<?php echo $list->option_A ?>">
<label for="radio-button-1">
<span class="frb-title"><?php echo $list->option_A ?> </span>
<span class="frb-description"></span>
</label>
</div>
</div>
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-2" name="ans2" value="<?php echo $list->option_B ?>">
<label for="radio-button-2">
<span class="frb-title"><?php echo $list->option_B ?></span>
<span class="frb-description"></span>
</label>
</div>
</div>
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-3" name="ans3" value="<?php echo $list->option_C ?>">
<label for="radio-button-3">
<span class="frb-title"><?php echo $list->option_C ?></span>
<span class="frb-description"></span>
</label>
</div>
</div>
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-4" name="ans4" value="<?php echo $list->option_D ?>">
<label for="radio-button-4">
<span class="frb-title"><?php echo $list->option_D ?></span>
<span class="frb-description"></span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php
}
}
?>
<div class="panel-footer rowpadding">
<div class="row">
<div class="col-md-6">
<button type="submit" class="btn btn-sm btn-block ">
<span class="fa fa-send"></span>
submit </button>
</div>
</div>
</div>
</form>
Is there anything that I am missing?
Your problem is that you are re-using the names and the IDs of your inputs. Names and IDs have to be unique for the HTML to be valid, and to work as you intend it to. You can have the input-names as HTML arrays instead, and group by that.
Using the $key of the array, you can define a unique name for each your group of answers. We also use this to define the IDs of your elements, since they must be unique.
Changes made are,
Include the $key in the loop
Adding -<?php echo $key; ?> to all instances where you use the ID of the buttons (and the reference in the label), to ensure all IDs are unique
Using name="answer[<?php echo $key; ?>]" instead of ans1, ans2, ans3, ans4. This ensures that only one radio button can be selected per answer, and that you have one array of answers, each element being the answer of one question.
foreach ($quizList as $key=>$list){
?>
<div class="row rowpadding">
<div class="col-md-8 col-md-offset-2" id="panel1-<?php echo $key; ?>">
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<?php echo $list->title; ?>
</h5>
</div>
<div class="panel-body two-col">
<div class="row">
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-1-<?php echo $key; ?>" name="answer[<?php echo $key; ?>]" value="<?php echo $list->option_A ?>">
<label for="radio-button-<?php echo $key; ?>">
<span class="frb-title"><?php echo $list->option_A ?> </span>
<span class="frb-description"></span>
</label>
</div>
</div>
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-2-<?php echo $key; ?>" name="answer[<?php echo $key; ?>]" value="<?php echo $list->option_B ?>">
<label for="radio-button-2-<?php echo $key; ?>">
<span class="frb-title"><?php echo $list->option_B ?></span>
<span class="frb-description"></span>
</label>
</div>
</div>
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-3-<?php echo $key; ?>" name="answer[<?php echo $key; ?>]" value="<?php echo $list->option_C ?>">
<label for="radio-button-3-<?php echo $key; ?>">
<span class="frb-title"><?php echo $list->option_C ?></span>
<span class="frb-description"></span>
</label>
</div>
</div>
<div class="col-md-6">
<div class="frb frb-danger margin-bottom-none">
<input type="radio" id="radio-button-4-<?php echo $key; ?>" name="answer[<?php echo $key; ?>]" value="<?php echo $list->option_D ?>">
<label for="radio-button-4-<?php echo $key; ?>">
<span class="frb-title"><?php echo $list->option_D ?></span>
<span class="frb-description"></span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php
}
Now, when you submit the form, the selected answers will be in an array where the name is answer. So you will have to do something like
foreach ($_POST['answer'] as $key=>$value) {
// $key is the same key from the loop above
// $value is the value of the selected radio button
}
Radio buttons are tied together by name. In your foreach(), you keep repeating the same names for each set of question answers. (You're also repeating the same ID, which is bad form, but won't break your script).
You need to restructure your radio buttons so that each group of buttons (that belong together) have the same name. And that name has to be unique per group.
A simplified example:
<form>
<p>These belong together, and all have the name "gender":</p>
<input type="radio" name="gender" value="male"> Male<br>
<input type="radio" name="gender" value="female"> Female<br>
<p>These belong together, and all have the name "team":</p>
<input type="radio" name="team" value="blue"> Blue<br>
<input type="radio" name="team" value="red"> Red<br>
</form>
An even more simplified answer
foreach($quizList as $key => $list){ ?>
<form>
<input type="radio" id="radio-button-1" name="answer[<?php echo $key;?>]" value="<?php echo $list->option_A ?>"> <!-- answer_0 -->
<input type="radio" id="radio-button-1" name="answer[<?php echo $key;?>]" value="<?php echo $list->option_B ?>"> <!-- answer_0 -->
</form>
Then in php you should get something like this:
$_POST['answer'] = [
'0' => 'foo'
//'1' => 'biz' ....
];
With Ajax
One note with numbered keys. IF you use AJAX (if not you can basically ignore this) you may lose numeric indexes when converting to and from JSON, for example imagine we expect this:
$_POST['answer'] = [
'0' => 'foo'
'2' => 'biz' ....
];
When that is encoded in Json it will likly be something like this (where did the keys go)
'{"answer":["foo", "biz"]}`
Then when PHP converts that back we have lost our keys. And we we'll have something like this:
$_POST['answer'] = [
0 => 'foo'
1 => 'biz' ....
];
This is also true of any array function that doesn't preserve keys, sort etc. The easy solution here is to just prefix the key with something like a or _ even. Then they will be strings and translate to objects in the JSON. In PHP you could still match these like this:
if("a$id" == $post_id){}
if(substr($post_id,1) == $id){}
//remove all prefixes
print_r(array_combine(preg_replace('/^a/', '', array_keys($answers)),$answers));
//it feels wrong but if you have to append you can do this
var_dump((int)'2a' == 2); //true so your key would be 2a because how PHP converts strings to ints.
And so on.
Hope it helps!

How can i fetch if there are two different types are there in database ex-(type=1,type=2) same table

I have database table as os_dish
in that dish type=1 is tiffen // dishtype=2 is lunch//
My error is only tiffen values are coming in both Tiffen And Lunch
i want to select multiple how can i do that this is my Tiffen code:
<div class="products-row">
<?php $tq=$conn->query("select * from os_dish where dish_type=1");
while ($tiffen = $tq->fetch_assoc()) {
?>
<div class="col-md-3">
<div class="foodmenuform row text-center">
<input type="checkbox" id="<?php echo $tiffen['dish_name'];?>" class="Foodmenu" value="<?php echo $tiffen['dish_name'];?>" name="tifeen[]" hidden>
<label for="<?php echo $tiffen['dish_name'];?>"><img src="img/dish/<?php echo $tiffen['dish_image']; ?>" class="img img-responsive" /></label>
</div>
</div>
<?php } ?>
</div>
And this is my Luch code:
<div class="products-row">
<?php $lq=$conn->query("select * from os_dish where dish_type=2");
while ($lunch = $lq->fetch_assoc()) {
?>
<div class="col-md-3">
<div class="foodmenuform row text-center">
<input type="checkbox" id="<?php echo $lunch['dish_name'];?>" class="FoodMenu" value="<?php echo $lunch['dish_name'];?>" name="lunch[]" hidden>
<label for="<?php echo $lunch['dish_name'];?>"><img src="img/dish/<?php echo $lunch['dish_image']; ?>" class="img img-responsive" /></label>
</div>
</div>
<?php } ?>
</div>

Add search fields to search bar magento

A friend has asked me to look at a website they had built (long story short they fell out so site didnt get finished). There is a search bar on the left hand side with 3 different search categories
Ive found the code for it in form.mini.phtml
<div id="search1">
<h3>
SEARCH >>>
</h3>
<form id="search_mini_form" action="<?php echo $catalogSearchHelper->getResultUrl() ?>" method="get">
<div id="label_area">
<div id="label_area">
</div>
<input type="text" name="label" id="label" value="Label >>>" onclick="if(this.value!='Label >>>'){ } else { this.value =''; } "size="15" class="text2">
</div>
<div id="label_area">
<div id="label_area">
</div>
<input type="text" name="artist" id="artist" value="Artists >>>" onclick="if(this.value!='Artists >>>'){ } else { this.value =''; } "size="15" class="text2">
</div>
<div id="label_area">
<div id="label_area">
</div>
<input id="search" type="text" name="<?php echo $catalogSearchHelper->getQueryParamName() ?>" value="<?php echo $catalogSearchHelper->getEscapedQueryText() ?>" class="text2" maxlength="<?php echo $catalogSearchHelper->getMaxQueryLength();?>" /></div>
<div id="label_area"> <input type="image" src="<?php echo $this->getSkinUrl('images/go.jpg')?>" />
</div>
</form>
</div>
<!--<form id="search_mini_form" action="<?php echo $catalogSearchHelper->getResultUrl() ?>" method="get">
<div class="form-search">
<label for="search"><?php echo $this->__('Search:') ?></label>
<input id="search" type="text" name="<?php echo $catalogSearchHelper->getQueryParamName() ?>" value="<?php echo $catalogSearchHelper->getEscapedQueryText() ?>" class="input-text" maxlength="<?php echo $catalogSearchHelper->getMaxQueryLength();?>" />
<button type="submit" title="<?php echo $this->__('Search') ?>" class="button"><span><span><?php echo $this->__('Search') ?></span></span> </button>-->
<div id="search_autocomplete" class="search-autocomplete"></div>
<script type="text/javascript">
//<![CDATA[
var searchForm = new Varien.searchForm('search_mini_form', 'search', '<?php echo $this->__('Keywords>>>>>>>') ?>');
searchForm.initAutocomplete('<?php echo $catalogSearchHelper->getSuggestUrl() ?>', 'search_autocomplete');
//]]>
</script>
<!-- </div>
</form>-->
It looks like the developer has hashed this together, My question is, how do go about getting the label/artist fields working? sorry for the clumsiness, Im a novice with PhP, Ive tried a couple of approaches with no joy, thank you very much in advance :)

PHP 1 item conversion to PHP loop

So I am trying to learn php, I have a simple 1 item order form, However I have 4 items in the data base I need to show on this order form. In javascript I would just write a loop for an array, however the whole php query form a table from a database has got me flustered and I am not sure how to loop the results to show more then the 1 item from the query and the still allow for ordering all on 1 page. Originaly I had it list a table so you would click on the item and it would redirect to a page for each item so each on can be ordered.
<?php
include_once 'helpers/helper.php';
include_once 'db_function.php';
session_start();
$show_query = "SELECT * FROM `meal_info` ORDER BY meal_time DESC LIMIT 4;";
$show_result = db_query($connect, $show_query);
if($show_result) {
$show_result_row = db_fetch_array($show_result);
}
?>
<?php include_once 'layout/header.php'; ?>
<?php
if(#$_SESSION['order_submit_msg']) {
echo flash_message('order_submit_msg');
unset($_SESSION['order_submit_msg']);
}
?>
<div>
<form action="make_deal.php" method="post">
<div>
<h1><?php echo $show_result_row['meal_name'];?></h1>
</div>
<hr>
<div>
<img class="meal-img" id="meal-img" src="<?php echo $show_result_row['meal_image'];?>" alt="">
</div>
<br>
<div>
<h2>Feature: <?php echo $show_result_row['meal_content'];?></h2>
<h3>Price: <?php echo $show_result_row['meal_price'];?></h3>
</div>
<input type="hidden" name="meal-id" value="<?php echo $show_result_row['meal_id'];?>">
<input type="hidden" name="meal-price" value="<?php echo $show_result_row['meal_price'];?>">
<br>
<div>
<legend>Name</legend>
<input type="text" name="order-username" placeholder="Full Name" required>
</div>
<br>
<div>
<legend>Phone</legend>
<input type="text" name="order-phone" placeholder="555-555-5555" required>
</div>
<br>
<div>
<legend>Address</legend>
<input type="text" name="order-address" placeholder="555 N. Main Street" required>
</div>
<br>
<div>
<legend>Quantity (Dozens)</legend>
<input type="text" name="order-count" placeholder="12" required>
</div>
<hr>
<div>
<button class="btn btn-warning btn-lg btn-block" type="submit">Submit Order</button>
</div>
</form>
</div>
<?php include_once 'layout/footer.php'; ?>
You're trying to display an array. You need to loop through the array.
<?php foreach ($show_result_row as $result) { ?>
<div>
<h1><?php echo $result['meal_name'];?></h1>
</div>
<hr>
<div>
<img class="meal-img" id="meal-img" src="<?php echo $result['meal_image'];?>" alt="">
</div>
<?php } ?>
Something like that.

Comments on the page wont show up

Hello i have a problem i cant see the comments on the page.
I dont get any error on the page so i am stuck on this moment
can somebody help me??
This is the php code:
<div id="container">
<?php include('includes/menu.php');?>
<div id="post">
<?php
$row = $query->fetch_object();
echo "<h2>".$row->title."</h1>";
echo "<p>".$row->body."</p>";
?>
</div>
<hr />
<div id="add-comments">
<form action="<?php echo $_SERVER['PHP_SELF']."?id=$id"?>" method="post">
<div>
<label>Email Adres</label><input type="text" name="email" />
</div>
<div>
<label>Naam</label><input type="text" name="name" />
</div>
<div>
<label>Commentaar</label><textarea name="comment"></textarea>
</div>
<input type="hidden" name="post_id" value="<?php echo $id?>" />
<input type="submit" name="submit" value="Toevoegen"/>
</form>
</div>
<hr />
<div id="comments">
<?php
$query = $db->query("SELECT * FROM comments WHERE post_id='$id' ORDER BY comment_id DESC");
while($row = $query->fetch_object()):
?>
<div>
<h5><?php echo $row->name?></h5>
<blockquote><?php echo $row->comment?></blockquote>
<?php endwhile;?>
</div>
</div>
</div>
and the rest of the page is:
<div id="container">
<?php include('includes/menu.php');?>
<div id="post">
<?php
$row = $query->fetch_object();
echo "<h2>".$row->title."</h1>";
echo "<p>".$row->body."</p>";
?>
</div>
<hr />
<div id="add-comments">
<form action="<?php echo $_SERVER['PHP_SELF']."?id=$id"?>" method="post">
<div>
<label>Email Adres</label><input type="text" name="email" />
</div>
<div>
<label>Naam</label><input type="text" name="name" />
</div>
<div>
<label>Commentaar</label><textarea name="comment"></textarea>
</div>
<input type="hidden" name="post_id" value="<?php echo $id?>" />
<input type="submit" name="submit" value="Toevoegen"/>
</form>
</div>
<hr />
<div id="comments">
<?php
$query = $db->query("SELECT * FROM comments WHERE post_id='$id' ORDER BY comment_id DESC");
while($row = $query->fetch_object()):
?>
<div>
<h5><?php echo $row->name?></h5>
<blockquote><?php echo $row->comment?></blockquote>
<?php endwhile;?>
</div>
</div>
</div>
Hope somebody see the problem.
try like this for printing comments..
<div id="comments">
<?php
$query = $db->query("SELECT * FROM comments WHERE post_id='$id' ORDER BY comment_id DESC");
while($row = $query->fetch_object()){ //opening while block
?>
<div>
<h5><?php echo $row->name;?></h5>
<blockquote><?php echo $row->comment;?></blockquote>
<?php }// ending while block ?>
</div>
</div>
<div id="comments">
<?PHP
$query = $db->query("SELECT name, comment FROM comments WHERE post_id='$id' ORDER BY comment_id DESC");
while($row = $query->fetch_object()) {
?>
<div>
<h5><?= $row->name ?></h5>
<blockquote><?= $row->comment ?></blockquote>
</div>
<?PHP } ?>
</div>
If that does not work, i would suggest dumping out the SQL query and making sure it is working.

Categories