Modifying a POST request to denote quantity

Question

I am currently working on allowing the administrator to choose the quantity to remove in the Orders -> Product page in the administrative backend, as shown here:

The default behavior right now is that if you want to remove the product, the entire quantity is remove (with no way to select how many to remove).

Looking at the POST requests sent in the AJAX (when you press the red "remove" button) in /admin/view/template/sale/order_form.tpl , I noticed that the following code below, denoted as order_total is in charge of product removal (apologies for the incredibly long line of code - that's just how OpenCart's code convention is.. One big line).

for (i in json['order_total']) {
    total = json['order_total'][i];

    html += '<tr id="total-row' + total_row + '">';
    html += '  <td class="right" colspan="4"><input type="hidden" name="order_total[' + total_row + '][order_total_id]" value="" /><input type="hidden" name="order_total[' + total_row + '][code]" value="' + total['code'] + '" /><input type="hidden" name="order_total[' + total_row + '][title]" value="' + total['title'] + '" /><input type="hidden" name="order_total[' + total_row + '][text]" value="' + total['text'] + '" /><input type="hidden" name="order_total[' + total_row + '][value]" value="' + total['value'] + '" /><input type="hidden" name="order_total[' + total_row + '][sort_order]" value="' + total['sort_order'] + '" />' + total['title'] + ':</td>';
    html += '  <td class="right">' + total['value'] + '</td>';
    html += '</tr>';

    console.log(html + "\n");

    total_row++;
}

$('#total').html(html);

As I saw within this hidden form request string, there is no way to define a key such as "quantity." In fact, I actually don't really have an idea on how it even removes an item, let alone the ability to modify the quantity. An example request string look like this:

<tr id="total-row0">  <td class="right" colspan="4"><input type="hidden" name="order_total[0][order_total_id]" value="" /><input type="hidden" name="order_total[0][code]" value="sub_total" /><input type="hidden" name="order_total[0][title]" value="Sub-Total" /><input type="hidden" name="order_total[0][text]" value="$0.00" /><input type="hidden" name="order_total[0][value]" value="0" /><input type="hidden" name="order_total[0][sort_order]" value="1" />Sub-Total:</td>  <td class="right">0</td></tr><tr id="total-row1">  <td class="right" colspan="4"><input type="hidden" name="order_total[1][order_total_id]" value="" /><input type="hidden" name="order_total[1][code]" value="total" /><input type="hidden" name="order_total[1][title]" value="Total" /><input type="hidden" name="order_total[1][text]" value="$0.00" /><input type="hidden" name="order_total[1][value]" value="0" /><input type="hidden" name="order_total[1][sort_order]" value="9" />Total:</td>  <td class="right">0</td></tr>

From my basic understanding, it seems to update the entire order total. Apologies for my ignorance.. I am totally new to JS/jQuery.

Answer 1

OK, here is what I found out when I opened the order_form.tpl - the deletion is done simply by removing a row from table (yes, in HTML words a <tr> is removed from <tbody> ) and saving the order (updating). And because the whole table containing products is also a form (literaly, ie <form> ) full of hidden inputs it should be possible to change the quantity the very same way as is done on frontend in checkout/cart .

If I were you I'd add a spinner input instead of textual representation for quantity, because this column (quantity) goes like this:

<td class="right"><?php echo $order_product['quantity']; ?>
  <input type="hidden" name="order_product[<?php echo $product_row; ?>][quantity]" value="<?php echo $order_product['quantity']; ?>" />
</td>

If you could change it for something like this:

<td class="right">
  <input type="text" name="order_product[<?php echo $product_row; ?>][quantity]" value="<?php echo $order_product['quantity']; ?>" />
</td>

(ie remove textual representation and change input hidden to input text) while optionally making the input as +/- (spinner) field, this could solve your problem.

Of course, in the end, you'd need to either click on Save or add also another small button next to the quantity input, something like

<td class="right">
  <input type="text" name="order_product[<?php echo $product_row; ?>][quantity]" value="<?php echo $order_product['quantity']; ?>" />
  <input type="image" src="view/image/update.png" alt="<?php echo $button_save; ?>" title="<?php echo $button_save; ?>" onclick="$('#button-update').trigger('click');" />
</td>

This could work for you ;-)