Skip to content

Instantly share code, notes, and snippets.

@jonathancg90
Created September 10, 2015 15:01
Show Gist options
  • Save jonathancg90/c4c108e7d027267f105f to your computer and use it in GitHub Desktop.
Save jonathancg90/c4c108e7d027267f105f to your computer and use it in GitHub Desktop.
**** HTML ****
<p><a href="#" class="btn btn-success"
role="button"
data-toggle="modal"
data-target="#cartModal"
data-product="{{ product.name }}"
data-presentation="{{ product.presentations.not_deleted()|objectjs }}" add-cart>Añadir al carrito</a>
**** SCRIPT *****
<script>
$(document).on('ready', function(){
$('[add-cart]').on('click', function(){
var $table = $('[presentations]');
var $product_name = $('[product_name]');
var content = "<tr><td>__name</td><td>S/. __price </td> " +
"<td class='col-xs-1'><input type='hidden' value='__presentation_id' name='p'> " +
"<input class='form-control input-sm' type='number' value='0' min='0' name='q' width='30px'>" +
"</td> </tr>";
var product = $(this).data('product');
var presentations = $(this).data('presentation');
$product_name.text(product);
$table.find('tr').remove();
$.each(presentations, function( index, value ) {
var name=value['fields']['name'];
var price=value['fields']['price'];
var id=value['pk'];
var presentation = content.replace('__presentation_id', id).replace('__price', price).replace('__name', name);
$table.append(presentation)
});
})
})
</script>
******* MODAL ****
<!-- Modal -->
<div class="modal fade" id="cartModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<form action="{{ url('public:cart_add') }}">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel" product_name></h4>
</div>
<div class="modal-body">
<form action="{{ url('public:cart_add') }}">
<table class="table table-striped table-bordered">
<thead>
<th>Presentación</th>
<th>Precio</th>
<th>Cantidad</th>
</thead>
<tbody presentations>
</tbody>
</table>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
<button type="submit" class="btn btn-primary">Añadir al carrito</button>
</div>
</div>
</form>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment