Delete Confirmation with Bootstrap - modal-dialog

I have following page to confirm the deletion of table item by using bootstrap modal. When I click delete button, I can not see the modal div. What's my wrong?
<?php
$content = [0=>["news_id"=>1,"news_title"=>"Hürriyet","news_date"=>"Bugün","news_content"=>"siyaset"],
1=>["news_id"=>2,"news_title"=>"Milliyet","news_date"=>"Yarın","news_content"=>"ekonomi"],
2=>["news_id"=>3,"news_title"=>"Sabah","news_date"=>"Dün","news_content"=>"politika"]]
?>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(function(){
$(".btn-show-modal").click(function(e){
e.preventDefault();
var id = $(this).attr('id');
var modal_id = "dialog-example_"+id;
$("#"+modal_id).modal('show');
});
$(".btn btn-danger").click(function(e) {
var id = $(this).attr('id');
var modal_id = "dialog-example_"+id;
$("#"+modal_id).modal('hide');
});
});
</script>
<div class="container">
<!-- Modal -->
<table class="table table-bordered">
<thead>
<tr>
<th width="60">ID</th>
<th width="200">Title</th>
<th width="150">Date Posted</th>
<th>Content</th>
<th width="200">Image</th>
<th width="200">Action</th>
</tr>
</thead>
<tbody>
<?php
foreach ($content as $row) {
?>
<tr>
<td><?php echo $row['news_id']; ?></td>
<td><?php echo $row['news_title']; ?></td>
<td><?php echo $row['news_date']; ?></td>
<td><?php echo $row['news_content']; ?></td>
<td><img style="height:50px; width:50px;" src="" ></td>
<td>
</span> Edit
<span class="glyphicon glyphicon-remove"></span> Delete
</td>
<div class="modal hide fade" id="dialog-example_<?php echo $row['news_id'] ?>">
<div class="modal-header">
<h5>Confirm Delete</h5>
</div>
<div class="modal-body">
<p class="modaltext">Are you sure you want to delete this record?</p>
</div>
<div class="modal-footer">
No
<a href="delete-project.php?code=<?php echo $row['news_id']; ?>"
class="btn btn-danger" id="<?php echo $row['news_id'] ;?>">Yes</a>
</div>
</div>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</body>
</html>
Because of this I can not see whether my code is running.


Working code!
I rewrote your modal and changed the way it opens to onclick="" functions for the button elements.
<?php
$content = [0=>["news_id"=>1,"news_title"=>"Hürriyet","news_date"=>"Bugün","news_content"=>"siyaset"],
1=>["news_id"=>2,"news_title"=>"Milliyet","news_date"=>"Yarın","news_content"=>"ekonomi"],
2=>["news_id"=>3,"news_title"=>"Sabah","news_date"=>"Dün","news_content"=>"politika"]]
?>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- Modal -->
<table class="table table-bordered">
<thead>
<tr>
<th width="60">ID</th>
<th width="200">Title</th>
<th width="150">Date Posted</th>
<th>Content</th>
<th width="200">Image</th>
<th width="200">Action</th>
</tr>
</thead>
<tbody>
<?php
foreach ($content as $row) {
?>
<tr>
<td>
<?php echo $row['news_id']; ?>
</td>
<td>
<?php echo $row['news_title']; ?>
</td>
<td>
<?php echo $row['news_date']; ?>
</td>
<td>
<?php echo $row['news_content']; ?>
</td>
<td><img style="height:50px; width:50px;" src=""></td>
<td>
<a href="edit2.php?newsid=<?php echo $row['news_id'];?>" class='btn btn-info left-margin'>
<span class="glyphicon glyphicon-edit">Edit</span>
</a>
<a onclick="$('#dialog-example_<?php echo $row['news_id'] ?>').modal('show');" href="#" class='btn-show-modal' data-toggle="modal" title="Delede Record">
<span class="glyphicon glyphicon-remove"></span> Delete
</a>
</td>
<div id="dialog-example_<?php echo $row['news_id'] ?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content" id="dialog-example_<?php echo $row['news_id'] ?>">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Confirm Delete</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to delete this record?</p>
</div>
<div class="modal-footer">
<!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
No
Yes
</div>
</div>
</div>
</div>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</body>
</html>

Related

How to send object that is retrived in a get request to a post requet | Spring Boot Thymeleaf

Let's say I have rendered the output rom the get request on an html template, now I need to use this same data to pass to a post request via a button on a same page. How do I do that?
I'm trying to do something like this:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>Customer Home</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div th:replace="fragments/header :: header">
</div>
<div class="container">
<p> Thanks for booking with Gamma Airlines, here are your booking summary: </p>
<table th:object="${booking} class="table table-bordered table-striped">
<tbody>
<tr>
<td>Source</td>
<td th:text="${routeStart}"></td>
</tr>
<tr>
<td>Destination</td>
<td th:text="${routeDestination}"></td>
</tr>
<tr>
<td>Booking Charges</td>
<td th:text="${bookingCharges}"></td>
</tr>
<tr>
<td>Booking Charges Currency</td>
<td th:text="${chargesCurrency}"></td>
</tr>
<tr>
<td>Booking Date</td>
<td th:text="${#calendars.format(bookingDate)}">July 11, 2012 2:17:16 PM CDT</td>
<tr>
<td>
<div class="col-sm-9">
<form action="#" th:action="#{/email}"
th:object="${booking}" method="post"
role="form">
<button type="submit" class="btn btn-primary btn-block">Email</button>
</form>
</div>
</td>
<td>
<div class="col-sm-9">
<form action="#" th:action="#{/genpdf}"
th:object="${booking}" method="post"
role="form">
<button type="submit" class="btn btn-primary btn-block">Generate PDF</button>
</form>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Edit: Somebody please help tell me a simple method to pass the object since I have to use it at many places and object contains many child object as well in some cases. eg. the following case:
<div style = "margin-top: 2cm" class="container">
<table class="table table-bordered table-striped">
<thead>
<tr>
<td>Source</td>
<td>Destination</td>
<td>Amount</td>
<td>Currency</td>
<td>Action</td>
</tr>
</thead>
<tbody>
<tr th:if="${offers.empty}">
<td colspan="5">No Offers</td>
</tr>
<tr th:each="offer : ${offers}">
<td th:text="${offer.route.from}"></td>
<td th:text="${offer.route.to}"></td>
<td th:text="${offer.price.amount}"></td>
<td th:text="${offer.price.currency}"></td>
<td>
<form action="#" th:action="#{/user/booking}"
th:object="${offer}" method="post"
role="form">
<button type="submit" class="btn btn-primary btn-block">Book</button>
</form>
</td>
</tr>
</tbody>
</table>
</div>
UPDATE 2:
I even changed the template by sending a new object in the get request and try to assign values one by one but I still get it as null in a controller.
<table class="table table-bordered table-striped">
<thead>
<tr>
<td>Source</td>
<td>Destination</td>
<td>Amount</td>
<td>Currency</td>
<td>Action</td>
</tr>
</thead>
<tbody>
<tr th:if="${offers.empty}">
<td colspan="5">No Offers</td>
</tr>
<tr th:each="offer : ${offers}">
<td th:text="${offer.route.from}"></td>
<td th:text="${offer.route.to}"></td>
<td th:text="${offer.price.amount}"></td>
<td th:text="${offer.price.currency}"></td>
<td>
<form action="#" th:action="#{/user/booking}"
th:object="${booking}" method="post"
role="form">
<input type="hidden" th:attr="value = ${offer.route.from}" th:field="*{routeStart}" />
<input type="hidden" th:attr="value = ${offer.route.to}" th:field="*{routeDestination}" />
<input type="hidden" th:attr="value = ${offer.price.amount}" th:field="*{bookingCharges}" />
<input type="hidden" th:attr="value = ${offer.price.currency}" th:field="*{chargesCurrency}" />
<button type="submit" class="btn btn-primary btn-block">Book</button>
</form>
</td>
</tr>
</tbody>
</table>
These are my get and post methods:
#RequestMapping(value="/user/booking", method = RequestMethod.GET)
public ModelAndView getOffers()
{
ModelAndView modelAndView = new ModelAndView();
AirlineOffer[] offersArray= airlineClient.getOffers();
List<AirlineOffer> offers = Arrays.asList(offersArray);
modelAndView.addObject("offers", offers);
Booking booking = new Booking();
modelAndView.addObject("booking", booking);
modelAndView.setViewName("user/booking");
return modelAndView;
}
/** POST method for submitting deposit request */
#RequestMapping(value = "/user/booking", method = RequestMethod.POST)
public ModelAndView book(#Valid Booking booking,
BindingResult bindingResult, HttpServletRequest request)
{
ModelAndView modelAndView = new ModelAndView();
......
}

Alright, I finally resolved it using the following in my form:
<table class="table table-bordered table-striped">
<thead>
<tr>
<td>Source</td>
<td>Destination</td>
<td>Amount</td>
<td>Currency</td>
<td>Action</td>
</tr>
</thead>
<tbody>
<tr th:if="${offers.empty}">
<td colspan="5">No Offers</td>
</tr>
<tr th:each="offer, stat : ${offers}">
<td th:text="${offer.route.from}"></td>
<td th:text="${offer.route.to}"></td>
<td th:text="${offer.price.amount}"></td>
<td th:text="${offer.price.currency}"></td>
<td>
<form action="#" th:action="#{/user/booking}"
th:object="${booking}" method="post"
role="form">
<input type="hidden" th:value="${offer.route.from}" name="routeStart" />
<input type="hidden" th:value = "${offer.route.to}" name="routeDestination" />
<input type="hidden" th:value = "${offer.price.amount}" name="bookingCharges" />
<input type="hidden" th:value = "${offer.price.currency}" name="chargesCurrency" />
<button type="submit" class="btn btn-primary btn-block">Book</button>
</form>
</td>
</tr>
</tbody>
All it took was to remove th:field and add the name attribute.

Magento Unable to post review

I am trying to add a review to a product in magento. However, submitting the review form of a product in the frontend gives me an "Unable to post review message".
I haven't found a solution to the problem, that's why im calling in your help :)
This is the code from my review form:
<div class="form-add">
<h2><?php echo $this->__('Write Your Own Review') ?></h2>
<?php if ($this->getAllowWriteReviewFlag()): ?>
<form action="<?php echo $this->getAction() ?>" method="post" id="review-form">
<?php echo $this->getBlockHtml('formkey'); ?>
<?php echo $this->getChildHtml('form_fields_before') ?>
<h3><?php echo $this->__("You're reviewing:"); ?>
<span><?php echo $this->escapeHtml($this->getProductInfo()->getName()) ?></span>
</h3>
<div class="fieldset">
<?php if ($this->getRatings() && $this->getRatings()->getSize()): ?>
<h4><?php echo $this->__('How do you rate this product?') ?> <em class="required">*</em></h4>
<span id="input-message-box"></span>
<table class="data-table review-summary-table ratings" id="product-review-table">
<col width="1"/>
<col/>
<col/>
<col/>
<col/>
<col/>
<thead>
<tr>
<th> </th>
<th>
<div class="rating-box">
<span class="rating-number">1</span>
<span class="rating nobr"
style="width:20%;"><?php echo $this->__('1 star') ?></span>
</div>
</th>
<th>
<div class="rating-box">
<span class="rating-number">2</span>
<span class="rating nobr"
style="width:40%;"><?php echo $this->__('2 star') ?></span>
</div>
</th>
<th>
<div class="rating-box">
<span class="rating-number">3</span>
<span class="rating nobr"
style="width:60%;"><?php echo $this->__('3 star') ?></span>
</div>
</th>
<th>
<div class="rating-box">
<span class="rating-number">4</span>
<span class="rating nobr"
style="width:80%;"><?php echo $this->__('4 star') ?></span>
</div>
</th>
<th>
<div class="rating-box">
<span class="rating-number">5</span>
<span class="rating nobr"
style="width:100%;"><?php echo $this->__('5 star') ?></span>
</div>
</th>
</tr>
</thead>
<tbody>
<?php foreach ($this->getRatings() as $_rating): ?>
<tr>
<th><?php echo $this->escapeHtml($_rating->getRatingCode()) ?></th>
<?php foreach ($_rating->getOptions() as $_option): ?>
<td class="value"><label
for="<?php echo $this->escapeHtml($_rating->getRatingCode()) ?>_<?php echo $_option->getValue() ?>"><input
type="radio" name="ratings[<?php echo $_rating->getId() ?>]"
id="<?php echo $this->escapeHtml($_rating->getRatingCode()) ?>_<?php echo $_option->getValue() ?>"
value="<?php echo $_option->getId() ?>" class="radio"/></label></td>
<?php endforeach; ?>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<input type="hidden" name="validate_rating" class="validate-rating" value=""/>
<script type="text/javascript">decorateTable('product-review-table')</script>
<?php endif; ?>
<ul class="form-list">
<li>
<label for="review_field"
class="required"><em>*</em><?php echo $this->__('Let us know your thoughts') ?></label>
<div class="input-box">
<textarea name="detail" id="review_field" cols="5" rows="3"
class="required-entry"><?php echo $this->escapeHtml($data->getDetail()) ?></textarea>
</div>
</li>
<li class="inline-label">
<label for="summary_field"
class="required"><em>*</em><?php echo $this->__('Summary of Your Review') ?></label>
<div class="input-box">
<input type="text" name="title" id="summary_field" class="input-text required-entry"
value="<?php echo $this->escapeHtml($data->getTitle()) ?>"/>
</div>
</li>
<li class="inline-label">
<label for="nickname_field"
class="required"><em>*</em><?php echo $this->__("What's your nickname?") ?></label>
<div class="input-box">
<input type="text" name="nickname" id="nickname_field" class="input-text required-entry"
value="<?php echo $this->escapeHtml($data->getNickname()) ?>"/>
</div>
</li>
</ul>
</div>
<div class="buttons-set">
<button type="submit" title="<?php echo $this->__('Submit Review') ?>" class="button">
<span><span><?php echo $this->__('Submit Review') ?></span></span></button>
</div>
</form>
<script type="text/javascript">
//<![CDATA[
var dataForm = new VarienForm('review-form');
Validation.addAllThese(
[
['validate-rating', '<?php echo $this->__('Please select one of each of the ratings above') ?>', function (v) {
var trs = $('product-review-table').select('tr');
var inputs;
var error = 1;
for (var j = 0; j < trs.length; j++) {
var tr = trs[j];
if (j > 0) {
inputs = tr.select('input');
for (i in inputs) {
if (inputs[i].checked == true) {
error = 0;
}
}
if (error == 1) {
return false;
} else {
error = 1;
}
}
}
return true;
}]
]
);
//]]>
</script>
<?php else: ?>
<p class="review-nologged" id="review-form">
<?php echo $this->__('Only registered users can write reviews. Please, log in or register', $this->getLoginLink(), Mage::helper('customer')->getRegisterUrl()) ?>
</p>
<?php endif ?>
Looks like the standard rwd theme layout. If i delete my custom one so the rwd default pops up it still doesn't work.
The url that i'm posting from is as following:
https://www.example.com/review/product/post/id/73/
Hope someone can help me in the right direction. It's driving me crazy!!!

I solved the problem myself.
It had nothing to do with the reviews themselves. My first thought was a module that blocked access to the reviews, and after searching in de controller for reviews we found out that the problem was a module that couldn't have a certain length of characters stored in the database. This somehow conflicted with the reviews post.
After contacting the developers of that module we were able to solve the problem. The module was MailPlus and we solved it by going to the module its configuration and edited the following for Main website:
After changing this the reviews form started working again.
Thanks everybody for helping me!

Generated <form> inside Bootstrap-Modal needs to have a unique ID

Well, I searched the whole Internet the last days to find a way to attach an unique ID and/or name to a GENERATED form inside a Bootstrap-Modal and I never succeeded...
I know I'm making mistakes in the code, but I ran out of ideas, I don't know what to use.
*Edit: I'm using Bootstrap 3, I created a table, having a live search field using JavaScript. The table rows are displayed from a database using a query. The last column of the row pops up a Bootstrap-Modal inside which a form is located, now here is the problem! I managed to assign a unique ID to each Modal and each Modal popup button, but the form! From here everything is mist.
Here is the code:
<div id="fm-<?php echo $row['PacientID']; ?>" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×
</button>
<h4 class="modal-title">
<b>
Fișa medicală #<?php echo $row['PacientID']; ?>: <?php echo $row['Name'].' '.$row['Surname']; ?>
</b>
</h4>
<?php
if (isset ($entranceSuccess))
{
?>
<div class="alert alert-success text-center">
<?php echo $entranceSuccess; ?>
</div>
<?php
}
?>
<?php
if (isset ($entranceError))
{
?>
<div class="alert alert-danger text-center">
<?php echo $entranceError; ?>
</div>
<?php
}
?>
</div>
<form data-toggle="validator" id="entranceForm" role="form" method="POST">
<div class="modal-body">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th class="text-center">Data Intrării</th>
<th class="text-center">Medic Stomatolog</th>
<th class="text-center">Tratament</th>
<th class="text-center">Achitat</th>
</tr>
</thead>
<tbody>
<?php
$intrari = "SELECT * FROM intrari";
$intrariResults = $db -> query($intrari);
while ($row2 = $intrariResults -> fetch_assoc())
{
if ($row2['Pacient'] == $row['PacientID'])
{
?>
<tr class="text-center">
<th scope="row" class="text-center">
<?php echo $row2['EntranceDate'];?>
</th>
<td>
<?php
if ($row2['Medic'] == 1)
{
echo 'Dr. Carmen Pădurean';
}
else if ($row2['Medic'] == 2)
{
echo 'Dr. Claudiu Șuc';
}
else if ($row2['Medic'] == 3)
{
echo 'Dr. Mihaela Toncean';
}
else if ($row2['Medic'] == 4)
{
echo 'Dr. Alexandra Cenan';
}
else
{
echo 'MEDICUL STOMATOLOG NU A FOST DEFINIT!';
}
?>
</td>
<td>
<?php echo $row2['Treatment'];?>
</td>
<td>
<?php echo $row2['Achitat'];?>
</td>
</tr>
<?php
}
}
?>
<tr>
<th scope="row" class="text-center">
<div class="form-group">
<div class="input-group date entranceDateField">
<input type="text" class="form-control" id="entranceDate" name="entranceDate">
<div class="input-group-addon">
<span class="glyphicon glyphicon-th"></span>
</div>
</div>
</div>
</th>
<td>
<div class="form-group">
<select class="form-control" id="medic" name="medic">
<option value="1">Dr. Carmen Pădurean</option>
<option value="2">Dr. Claudiu Șuc</option>
<option value="3">Dr. Mihaela Toncean</option>
<option value="4">Dr. Alexandra Cenan</option>
</select>
</div>
</td>
<td>
<div class="form-group">
<input type="text" class="form-control" id="treatment" name="treatment">
</div>
</td>
<td>
<div class="form-group">
<input type="text" class="form-control" id="achitat" name="achitat">
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success" id="addEntrance" name="addEntrance-<?php echo $row['PacientID'];?>">
<span class='glyphicon glyphicon-plus'></span> Adaugă Intrare
</button>
<?php
if (isset ($_POST['addEntrance-<?php echo $row[PacientID]; ?>']))
{
$entranceDate = $_POST['entranceDate'];
$pacient = $row['PacientID'];
$medic = $_POST['medic'];
$treatment = $_POST['treatment'];
$achitat = $_POST['achitat'];
$insertEntrance = "INSERT INTO intrari (EntranceDate, Pacient, Medic, Treatment, Achitat)
VALUES ('$entranceDate', '$pacient', '$medic', '$treatment', '$achitat')";
if (mysqli_query ($db, $insertEntrance))
{
$entranceSuccess = "Pacientul a fost adăugat în baza de date cu succes!";
}
else
{
$entranceError = "A apărut o eroare nedefinită! Suna-l pe Andrei (0755 696 200) și dictează-i: \"Error code: " . mysqli_error ($db) . "\"";
}
}
?>
</div>
</form>
</div>
</div>

By looking at your code, I see you are putting Modal HTML inside loop and by assigning unique id's to modal selector id="fm-<?php echo $row['PacientID']; ?>" trying to create multiple modals with unique id(s), it will cause the page to load slow and running queries inside each unique modal fetching the records from database when even you don't need fetched records on page load, it's not a good practice,
so let's go one step backward and remove the Modal from while loop and put it outside and remove <?php echo $row['PacientID']; ?> from Modal id selector.
<div id="fm" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
//Modal-Header, Modal-Body, Modal-Footer Comes Here
</div>
</div>
</div>
Now as you stated The last column of the row pops up a Bootstrap-Modal
Assuming you are triggering the modal with default behaviour with data attributes data-toggle="modal" data-target="#fm" and you have other information in other columns of rows like <?php echo $row['Name'].' '.$row['Surname']; ?> so you must have something like
<tr>
<td><?php echo $row['PacientID']; ?></td>
<td><?php echo $row['Name'].' '.$row['Surname']; ?></td>
<td><button type="button" class="btn btn-info" data-toggle="modal" data-target="#fm">Open Modal</button></td>
</tr>
Now Let's pass the pacientid and name to modal, Add data-attribute data-pacient to name col and to modal trigger button so above table col's will be
<tr>
<td><?php echo $row['PacientID']; ?></td>
<td><span class="pacientname" data-pacient="<?php echo $row['PacientID']; ?>"><?php echo $row['Name'].' '.$row['Surname']; ?></span></td>
<td><button type="button" data-pacient="<?php echo $row['PacientID']; ?>" class="btn btn-info" data-toggle="modal" data-target="#fm">Open Modal</button></td>
</tr>
With bootstrap modal event listener, you can pass the information to modal when modal about to show or shown
$(document).ready(function(){ //Dom Ready
$('#fm').on('show.bs.modal', function (e) { //Show event listener
var id = $(e.relatedTarget).data('pacient'); //Fetch val from modal data-attribute
var name = $('.pacientname[data-pacient="' + id +'"]').html(); //fetch val from selector `pacientname` data-attribute with match the val of modal button data-attribute
$(".pid").html(id); //selector inside modal header to pass id
$(".pname").html(name); //selector inside modal header to pass name
$("#addEntrance").val(id); //Passing id to hidden input in form, explained below
//Ajax method comes here which explains below
});
});
Modal-Header
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title"><span class="pid"></span> <span class="pname"></span></h4>
</div>
Fiddle Example to pass information to modal
Now about the query you are running inside modal, it can be done via Ajax method and display the information in modal. As we already have the required variable var id = $(e.relatedTarget).data('pacient'); can use it to fetch the required information via Ajax method
var dataString = 'id='+ id;
alert(dataString);
$.ajax({
type: "POST",
url: "file.php", //Create this file and handle query in it.
data: dataString,
cache: false,
success: function (data) {
$("#morecontent > tbody.showHere").html(data); //show fetched information from database
}
});
and file.php will be
<?php
//Database Connection Here
if(isset($_POST["id"])) {
$id = $_POST["id"]; //escape the string
$queryIntrari = "SELECT * FROM intrari WHERE Pacient = '$id'";
$intrariResults = $db -> query($queryIntrari);
while ($row2 = $intrariResults -> fetch_assoc()){
?>
<tr class="text-center">
<th scope="row" class="text-center">
<?php echo $row2['EntranceDate'];?>
</th>
<td>
<?php
if ($row2['Medic'] == 1)
{
echo 'Dr. Carmen Pădurean';
}
else if ($row2['Medic'] == 2)
{
echo 'Dr. Claudiu Șuc';
}
else if ($row2['Medic'] == 3)
{
echo 'Dr. Mihaela Toncean';
}
else if ($row2['Medic'] == 4)
{
echo 'Dr. Alexandra Cenan';
}
else
{
echo 'MEDICUL STOMATOLOG NU A FOST DEFINIT!';
}
?>
</td>
<td><?php echo $row2['Treatment'];?></td>
<td><?php echo $row2['Achitat'];?></td>
</tr>
<?php } } ?>
and the Modal-body, Modal-Footer with form and information fetched from database using Ajax will be like
<table class="table table-hover table-bordered" id="morecontent">
<form data-toggle="validator" id="entranceForm" role="form" method="POST">
<input type="hidden" id="addEntrance" name="addEntrance" value="">
<div class="modal-body">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th class="text-center">Data Intrării</th>
<th class="text-center">Medic Stomatolog</th>
<th class="text-center">Tratament</th>
<th class="text-center">Achitat</th>
</tr>
</thead>
<tbody class="showHere">
//Information Fetched from Database Using Ajax will show Here
</tbody>
<tbody>
<tr>
<th scope="row" class="text-center">
<div class="form-group">
<div class="input-group date entranceDateField">
<input type="text" class="form-control" id="entranceDate" name="entranceDate">
<div class="input-group-addon">
<span class="glyphicon glyphicon-th"></span>
</div>
</div>
</div>
</th>
<td>
<div class="form-group">
<select class="form-control" id="medic" name="medic">
<option value="1">Dr. Carmen Pădurean</option>
<option value="2">Dr. Claudiu Șuc</option>
<option value="3">Dr. Mihaela Toncean</option>
<option value="4">Dr. Alexandra Cenan</option>
</select>
</div>
</td>
<td>
<div class="form-group">
<input type="text" class="form-control" id="treatment" name="treatment">
</div>
</td>
<td>
<div class="form-group">
<input type="text" class="form-control" id="achitat" name="achitat">
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success">
<span class='glyphicon glyphicon-plus'></span> Adaugă Intrare
</button>
</div>
</form>
Note: Created a hidden input in <form> above, passed the value <?php echo $row['PacientID']; ?> to the hidden input when modal show, Post this hidden input along with other inputs when submitted the form in modal to insert or update values into database
an example here
Mission accomplished and hope you figure it out how to pass and get information in modal
Note: You can submit the modal form either the way you are doing or can also do it with Ajax and show success or error message inside modal without closing it and leaving the page but that's another story to tell some other time.
Happy Coding.

Vertically center input form in table Twitter Bootstrap

I can't vertically center input form in table using Twitter Bootstrap. I've found solution on the stack but it works only with plain text, doesn't work with input form (class vert-align). Do you have any suggestions?
JSFiddle
<table class="table table-striped">
<tr>
<th>
#
</th>
<th>
<i class="glyphicon glyphicon-check"></i>
</th>
<th>
Item#1
</th>
<th>
Item#2
</th>
</tr>
<div class="row">
<tr>
<div class="col-md-2">
<td class="vert-align">
1
</td>
</div>
<div class="col-md-2">
<td class="vert-align">
<input type="checkbox">
</td>
</div>
<div class="col-md-4">
<td class="vert-align">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span><input type="text" class="form-control" placeholder="...">
</div>
</div>
</td>
</div>
<div class="col-md-4">
<td class="vert-align">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-refresh"></i></span><input type="text" class="form-control" placeholder="...">
</div>
</div>
</td>
</div>
</tr>
</div>
<div class="row">
<tr>
<div class="col-md-2">
<td class="vert-align">
2
</td>
</div>
<div class="col-md-2">
<td class="vert-align">
<input type="checkbox">
</td>
</div>
<div class="col-md-4">
<td>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span><input type="text" class="form-control" placeholder="...">
</div>
</div>
</td>
</div>
<div class="col-md-4">
<td>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-refresh"></i></span><input type="text" class="form-control" placeholder="...">
</div>
</div>
</td>
</div>
</tr>
</div>
</table>
and css
.datepicker.dropdown-menu {
z-index: 1151;
}
.table tbody>tr>td.vert-align {
vertical-align: middle;
}

Zend: How do i create custom form elements using setDecorators()?

I need the form html like below:
<form>
<div class="es_form_txt">Name</div>
<div class="es_form"><input type="text" value="" class="email1"></div>
<div class="clear1"></div>
<div class="es_form_txt">Gender</div>
<div class="es_form">
<input type="radio" value="" name=""> Male
<input type="radio" value="" name=""> Female
<input type="radio" value="" name=""> Other
</div>
<div class="clear1"></div>
<div class="es_form_txt">Country Code</div>
<div class="es_form"><input type="text" value="" class="email1"></div>
<div class="clear1"></div>
<div class="es_form_txt">Phone</div>
<div class="es_form"><input type="text" value="" class="email1"></div>
<div class="clear1"></div>
<div class="clear1"></div>
<div class="es_form"> </div>
<div class="es_form"><input type="button" class="button" value="Update"></div>
<div class="clear"></div>
</form>
I tried all sorts of solution in here not working! Could anyone point me in right direction?

I find that when I need to display specific HTML when using Zend_Form the most reliable solution is usually to use the ViewScript decorator.
Build a normal form using Zend_Form.
<?php
//application/forms/Search.php
class Application_Form_Search extends Zend_Form
{
public function init()
{
$this->setMethod('POST');
//assign the view script to the decorator, this can also be done in the controller
$this->setDecorators(array(
array('ViewScript', array(
'viewScript' => '_searchForm.phtml'
))
));
// create new element
$query = $this->createElement('text', 'query');
// element options
$query->setLabel('Search Keywords');
// add the element to the form
$this->addElement($query);
//submit element
$submit = $this->createElement('submit', 'search');
$submit->setLabel('Search Site');
$submit->setDecorators(array('ViewHelper'));
$this->addElement($submit);
}
}
Then build the actual script used to render the form.
<!-- ~/views/scripts/_searchForm.phtml -->
<article class="search">
<!-- set the action and the method -->
<form action="<?php echo $this->element->getAction()?>" method="<?php echo $this->element->getMethod()?>">
<table>
<tr>
<!-- you can render individual decorators. -->
<th><?php echo $this->element->query->renderLabel()?></th>
</tr>
<tr>
<td><?php echo $this->element->query->renderViewHelper()?></td>
</tr>
<tr>
<!-- or you can render a complete element -->
<td><?php echo $this->element->search?></td>
</tr>
</table>
</form>
</article>
This currently renders as:
<article class="search">
<form action="/video/index/display" method="post">
<table>
<tr>
<th>
<dt id="query-label">
<label for="query" class="optional">Search Keywords</label>
</dt>
</th>
</tr>
<tr>
<td>
<input type="text" name="query" id="query" value="" placeholder="Movie Title" size="20">
</td>
</tr>
<tr>
<td>
<input type="submit" name="search" id="search" value="Search Video Collection!">
</td>
</tr>
</table>
</form>
</article>
Some experimentation will be required to get exactly the output you require.