diff --git a/InvenTree/InvenTree/static/script/inventree/inventree.js b/InvenTree/InvenTree/static/script/inventree/inventree.js
index ce812afc4f..c3e64d80de 100644
--- a/InvenTree/InvenTree/static/script/inventree/inventree.js
+++ b/InvenTree/InvenTree/static/script/inventree/inventree.js
@@ -97,8 +97,10 @@ function makeProgressBar(value, maximum, opts) {
         percent = 100;
     }
 
+    var id = opts.id || 'progress-bar';
+
     return `
-    <div class='progress'>
+    <div id='${id}' class='progress'>
         <div class='progress-bar' role='progressbar' aria-valuenow='${percent}' aria-valuemin='0' aria-valuemax='100' style='width:${percent}%'></div>
         <div class='progress-value'>${value} / ${maximum}</div>
     </div>
diff --git a/InvenTree/order/templates/order/sales_order_detail.html b/InvenTree/order/templates/order/sales_order_detail.html
index 53b3dd869c..88b7fa8976 100644
--- a/InvenTree/order/templates/order/sales_order_detail.html
+++ b/InvenTree/order/templates/order/sales_order_detail.html
@@ -133,7 +133,9 @@ $("#so-lines-table").inventreeTable({
             field: 'quantity',
             title: 'Quantity',
             formatter: function(value, row, index, field) {
-                return makeProgressBar(row.allocated, row.quantity);
+                return makeProgressBar(row.allocated, row.quantity, {
+                    id: `order-line-progress-${row.pk}`,
+                });
             },
             sorter: function(valA, valB, rowA, rowB) {