我是整个网络开发的初学者,在经过大量研究之后,我仍然无法完成这项工作.很感谢任何形式的帮助.我正在使用最新的rails版本和bootstrap来使事情变得更漂亮.
我有一个页面,其中包含一个餐厅的订单.如果单击一行,我希望它使用bootstrap在模态窗口中显示订单详细信息.我已设法通过onclick + javascript函数打开模态,但它看起来有点混乱,我仍然不知道如何加载模式的内容div与订单信息.这是我的代码:
HTML:
<h1>Orders</h1>
<table class="table table-striped"
<thead>
<tr>
<th>ID</th>
<th>Customer</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<% @restaurant.orders.each do |order| %>
<tr onclick="orderModal(<%= order.id %>);">
<td><%= order.id %></td>
<td><%= order.customer_id %></td>
<td><%= order.status %></td>
</tr>
<% end %>
</tbody>
</table>
<div id="orderModal" class="modal hide fade" role="dialog"
aria-labelledby="orderModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
<h3>Order</h3>
</div>
<div id="orderDetails"class="modal-body"></div>
<div id="orderItems" class="modal-body"></div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
JS:
function orderModal(order_id){
$('#orderModal').modal({
keyboard: true,
backdrop: "static"
}); …Run Code Online (Sandbox Code Playgroud)