I have developed a custom option with type=number and name of quantity that reflects the checkbox code. This is working wonderfully. (It adds correctly from the add order button in the administration and from the front of the store)
However, I have noticed that if I go to edit an order with a product, the option quantity at first appears on the #tab-product page, but then disappears once the cart options load.
At First:
numberdata.png (7.75 KiB) Viewed 2394 times
numbercart.PNG (12.4 KiB) Viewed 2394 times
It's as if the $data object is correctly passing the information to the .tpl file; however when the cart adds the product to itself, it is not passing anything with type=number. I have attempted to remedy this by changing the following code in the #button-customer onClick event and in the #cart.delegate (.btn-primary click event) to no avail.
Changed
Code: Select all
data: $('#cart input[name^=\'product\'][type=\'text\'], #cart input[name^=\'product\'][type=\'hidden\'], #cart input[name^=\'product\'][type=\'radio\']:checked, #cart input[name^=\'product\'][type=\'checkbox\']:checked, #cart select[name^=\'product\'], #cart textarea[name^=\'product\']'),
Code: Select all
data: $('#cart input[name^=\'product\'][type=\'text\'], #cart input[name^=\'product\'][type=\'number\'], #cart input[name^=\'product\'][type=\'hidden\'], #cart input[name^=\'product\'][type=\'radio\']:checked, #cart input[name^=\'product\'][type=\'checkbox\']:checked, #cart select[name^=\'product\'], #cart textarea[name^=\'product\']'),Code: Select all
. . .
<div class="tab-pane" id="tab-cart">
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<td class="text-left"><?php echo $column_product; ?></td>
<td class="text-left"><?php echo $column_model; ?></td>
<td class="text-right"><?php echo $column_quantity; ?></td>
<td class="text-right"><?php echo $column_price; ?></td>
<td class="text-right"><?php echo $column_total; ?></td>
<td><?php echo $column_action; ?></td>
</tr>
</thead>
<tbody id="cart">
<?php if ($order_products || $order_vouchers) { ?>
<?php $product_row = 0; ?>
<?php foreach ($order_products as $order_product) { ?>
<tr>
<td class="text-left"><?php echo $order_product['name']; ?><br />
<input type="hidden" name="product[<?php echo $product_row; ?>][product_id]" value="<?php echo $order_product['product_id']; ?>" />
<?php foreach ($order_product['option'] as $option) { ?>
- <small><?php echo $option['name']; ?>: <?php echo $option['value']; ?></small><br />
<?php if ($option['type'] == 'select' || $option['type'] == 'radio' || $option['type'] == 'image') { ?>
<input type="hidden" name="product[<?php echo $product_row; ?>][option][<?php echo $option['product_option_id']; ?>]" value="<?php echo $option['product_option_value_id']; ?>" />
<?php } ?>
<?php if ($option['type'] == 'text') { ?>
<input type="hidden" name="product[<?php echo $product_row; ?>][option][<?php echo $option['product_option_id']; ?>][<?php echo $option_value['product_option_value_id']; ?>]" value="<?php echo $option['product_option_value_id']; ?>" />
<?php } ?>
<?php if ($option['type'] == 'quantity') { ?>
<input type="hidden" name="product[<?php echo $product_row; ?>][option][<?php echo $option['product_option_id']; ?>][<?php echo $option_value['product_option_value_id']; ?>]" value="<?php echo $option['product_option_value_id']; ?>" />
<?php } ?>
<?php if ($option['type'] == 'checkbox') { ?>
<input type="hidden" name="product[<?php echo $product_row; ?>][option][<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option['product_option_value_id']; ?>" />
<?php } ?>
<?php if ($option['type'] == 'textarea' || $option['type'] == 'customprice' || $option['type'] == 'file' || $option['type'] == 'date' || $option['type'] == 'datetime' || $option['type'] == 'time') { ?>
<input type="hidden" name="product[<?php echo $product_row; ?>][option][<?php echo $option['product_option_id']; ?>]" value="<?php echo $option['value']; ?>" />
<?php } ?>
<?php } ?></td>
<td class="text-left"><?php echo $order_product['model']; ?></td>
<td class="text-right"><?php echo $order_product['quantity']; ?>
<input type="hidden" name="product[<?php echo $product_row; ?>][quantity]" value="<?php echo $order_product['quantity']; ?>" /></td>
<td class="text-right"></td>
<td class="text-right"></td>
<td class="text-center"></td>
</tr>
<?php $product_row++; ?>
<?php } ?>
. . .
</table>
</div>
<ul class="nav nav-tabs nav-justified">
<li class="active"><a href="#tab-product" data-toggle="tab"><?php echo $tab_product; ?></a></li>
<li><a href="#tab-voucher" data-toggle="tab"><?php echo $tab_voucher; ?></a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab-product">
<fieldset>
<legend><?php echo $text_product; ?></legend>
<div class="form-group">
<label class="col-sm-2 control-label" for="input-product"><?php echo $entry_product; ?></label>
<div class="col-sm-10">
<input type="text" name="product" value="" id="input-product" class="form-control" />
<input type="hidden" name="product_id" value="" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="input-quantity"><?php echo $entry_quantity; ?></label>
<div class="col-sm-10">
<input type="text" name="quantity" value="1" id="input-quantity" class="form-control" />
</div>
</div>
<div id="option"></div>
</fieldset>
<div class="text-right">
<button type="button" id="button-product-add" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-primary"><i class="fa fa-plus-circle"></i> <?php echo $button_product_add; ?></button>
</div>
</div>
...
<div class="row">
<div class="col-sm-6 text-left">
<button type="button" onclick="$('a[href=\'#tab-customer\']').tab('show');" class="btn btn-default"><i class="fa fa-arrow-left"></i> <?php echo $button_back; ?></button>
</div>
<div class="col-sm-6 text-right">
<button type="button" id="button-cart" class="btn btn-primary"><i class="fa fa-arrow-right"></i> <?php echo $button_continue; ?></button>
</div>
</div>
</div>
. . .
<script type="text/javascript"><!--
. . .
$('#button-customer').on('click', function() {
$.ajax({
url: $('select[name=\'store\'] option:selected').val() + 'index.php?route=api/customer&token=' + token,
type: 'post',
data: $('#tab-customer input[type=\'text\'], #tab-customer input[type=\'hidden\'], #tab-customer input[type=\'radio\']:checked, #tab-customer input[type=\'checkbox\']:checked, #tab-customer select, #tab-customer textarea'),
dataType: 'json',
crossDomain: true,
beforeSend: function() {
$('#button-customer').button('loading');
},
complete: function() {
$('#button-customer').button('reset');
},
success: function(json) {
$('.alert, .text-danger').remove();
$('.form-group').removeClass('has-error');
if (json['error']) {
if (json['error']['warning']) {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['warning'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>');
}
for (i in json['error']) {
var element = $('#input-' + i.replace('_', '-'));
if (element.parent().hasClass('input-group')) {
$(element).parent().after('<div class="text-danger">' + json['error'][i] + '</div>');
} else {
$(element).after('<div class="text-danger">' + json['error'][i] + '</div>');
}
}
// Highlight any found errors
$('.text-danger').parentsUntil('.form-group').parent().addClass('has-error');
} else {
// Refresh products, vouchers and totals
var request_1 = $.ajax({
url: $('select[name=\'store\'] option:selected').val() + 'index.php?route=api/cart/add&token=' + token,
type: 'post',
data: $('#cart input[name^=\'product\'][type=\'text\'], #cart input[name^=\'product\'][type=\'number\'], #cart input[name^=\'product\'][type=\'hidden\'], #cart input[name^=\'product\'][type=\'radio\']:checked, #cart input[name^=\'product\'][type=\'checkbox\']:checked, #cart select[name^=\'product\'], #cart textarea[name^=\'product\']'),
dataType: 'json',
crossDomain: true,
beforeSend: function() {
$('#button-product-add').button('loading');
},
complete: function() {
$('#button-product-add').button('reset');
},
success: function(json) {
$('.alert, .text-danger').remove();
$('.form-group').removeClass('has-error');
if (json['error'] && json['error']['warning']) {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['warning'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>');
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
var request_2 = request_1.then(function() {
$.ajax({
url: $('select[name=\'store\'] option:selected').val() + 'index.php?route=api/voucher/add&token=' + token,
type: 'post',
data: $('#cart input[name^=\'voucher\'][type=\'text\'], #cart input[name^=\'voucher\'][type=\'hidden\'], #cart input[name^=\'voucher\'][type=\'radio\']:checked, #cart input[name^=\'voucher\'][type=\'checkbox\']:checked, #cart select[name^=\'voucher\'], #cart textarea[name^=\'voucher\']'),
dataType: 'json',
crossDomain: true,
beforeSend: function() {
$('#button-voucher-add').button('loading');
},
complete: function() {
$('#button-voucher-add').button('reset');
},
success: function(json) {
$('.alert, .text-danger').remove();
$('.form-group').removeClass('has-error');
if (json['error'] && json['error']['warning']) {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['warning'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>');
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
request_2.done(function() {
$('#button-refresh').trigger('click');
$('a[href=\'#tab-cart\']').tab('show');
});
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
. . .
$('#button-product-add').on('click', function() {
$.ajax({
url: $('select[name=\'store\'] option:selected').val() + 'index.php?route=api/cart/add&token=' + token,
type: 'post',
data: $('#tab-product input[name=\'product_id\'], #tab-product input[name=\'quantity\'], #tab-product input[name^=\'option\'][type=\'text\'], #tab-product input[name^=\'option\'][type=\'number\'], #tab-product input[name^=\'option\'][type=\'hidden\'], #tab-product input[name^=\'option\'][type=\'radio\']:checked, #tab-product input[name^=\'option\'][type=\'checkbox\']:checked, #tab-product select[name^=\'option\'], #tab-product textarea[name^=\'option\']'),
dataType: 'json',
crossDomain: true,
beforeSend: function() {
$('#button-product-add').button('loading');
},
complete: function() {
$('#button-product-add').button('reset');
},
success: function(json) {
$('.alert, .text-danger').remove();
$('.form-group').removeClass('has-error');
if (json['error']) {
if (json['error']['warning']) {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['warning'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>');
}
if (json['error']['option']) {
for (i in json['error']['option']) {
var element = $('#input-option' + i.replace('_', '-'));
if (element.parent().hasClass('input-group')) {
$(element).parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
} else {
$(element).after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
}
}
}
if (json['error']['store']) {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['store'] + '</div>');
}
// Highlight any found errors
$('.text-danger').parentsUntil('.form-group').parent().addClass('has-error');
} else {
// Refresh products, vouchers and totals
$('#button-refresh').trigger('click');
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
. . .
$('#cart').delegate('.btn-primary', 'click', function() {
var node = this;
// Refresh products, vouchers and totals
$.ajax({
url: $('select[name=\'store\'] option:selected').val() + 'index.php?route=api/cart/add&token=' + token,
type: 'post',
data: $('#cart input[name^=\'product\'][type=\'text\'], #cart input[name^=\'product\'][type=\'number\'], #cart input[name^=\'product\'][type=\'hidden\'], #cart input[name^=\'product\'][type=\'radio\']:checked, #cart input[name^=\'product\'][type=\'checkbox\']:checked, #cart select[name^=\'product\'], #cart textarea[name^=\'product\']'),
dataType: 'json',
crossDomain: true,
beforeSend: function() {
$(node).button('loading');
},
complete: function() {
$(node).button('reset');
},
success: function(json) {
$('.alert, .text-danger').remove();
$('.form-group').removeClass('has-error');
if (json['error'] && json['error']['warning']) {
$('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['warning'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>');
}
if (json['success']) {
$('#content > .container-fluid').prepend('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">×</button></div>');
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
}).done(function() {
$('#button-refresh').trigger('click');
});
});
$('#button-cart').on('click', function() {
$('a[href=\'#tab-payment\']').tab('show');
});
. . . 
