Fetching price_list_rate in barcode printing

I am trying to fetch the price_list_rate of an item and display it in the barcode I Am printing.

Here is what I tried and did not work:

body { max-height: 96px; /* 1 inch */ max-width: 192px; /* 2 inches */ overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0; text-align: center; } .item-info { font-size: 11px; /* Smaller font size for info */ }
Loading...
<script>
    document.addEventListener("DOMContentLoaded", async function () {
        const barcodeValue = "{{ doc.barcodes[0].barcode }}"; // Ensure this path is correct
        const itemName = "{{ doc.item_name }}";
        const itemCode = "{{ doc.item_code }}"; // Ensure we fetch item code correctly

        // Generate the barcode
        JsBarcode("#barcode", barcodeValue, {
            format: "CODE128",
            lineColor: "#000000",
            width: 1.4, // Adjust the width for better barcode thickness
            height: 35, // Set the height of the barcode
            displayValue: true,
            fontSize: 10, // Adjust font size for the item info
        });

        try {
            // Specify your price list name
            const priceList = "Standard Selling"; 

            // Correctly structure the query
            const filters = { item_code: itemCode, price_list: priceList };
            
            // Fetch the selling price for the specific item and price list
            const result = await frappe.db.get_value("Item Price", filters, "price_list_rate");

            // Check if result is valid and extract the price
            const itemPrice = result && result.price_list_rate ? result.price_list_rate : "N/A"; // Fallback if price not found

            // Display the item information
            const itemInfo = `
                ${itemName} <br>
                $${itemPrice} <br>
            `;
            document.getElementById("item-info").innerHTML = itemInfo;
        } catch (error) {
            console.error("Error fetching item price:", error);
            document.getElementById("item-info").innerHTML = `
                ${itemName} <br>
                $N/A <br>
            `;
        }
    });
</script>

Could someone please help me figure out why the try block is always catching error?

Just for checking errors, remove your try block code from inside the try block and check what error is thrown. Also, check the JavaScript console and add log statements to check what value you are getting.

@ejaaz Thank you for your reply. when I did that, clicking on print opens new tab of the page to be printed as pdf and opens the browser print dialog. inspecting this tab and the tab of the item page where i click print shows nothing in the console. It is also safe to say I am getting nothing in the const result = await frappe.db.get_value(“Item Price”, filters, “price_list_rate”); even tho there is a price list related to this item of this item_code from the document, since upon further inspection, i am getting the barcode and the item_name but not the price_list_rate

Couldn’t fix it so used standard selling rate instead

<!DOCTYPE html>
<html lang="en">
<head>
  <script src="https://cdn.jsdelivr.net/npm/jsbarcode@3.9.0/dist/JsBarcode.all.min.js"></script>
  <style>
    body {
      height: 70px; /* 1.1 inch */
      width: 135px; /* 1.57 inches */
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; 
      margin: 0;
      text-align: center;
    }
    .item-info {
      font-size: 9px; /* Smaller font size for info */
    }
  </style>
</head>
<body>
  <svg id="barcode"></svg>
  <div class="item-info" id="item-info"></div>

  <script>
    document.addEventListener("DOMContentLoaded", function () {
      const barcodeValue = "{{ doc.barcodes[0].barcode  }}"; // Ensure path is correct and defaults to empty if missing
      const itemName = "{{ doc.item_name  }}";
      const standardSellingRate = {{ doc.standard_rate  }}; // Use a default if rate is missing

      if (barcodeValue) {
        // Generate the barcode
        JsBarcode("#barcode", barcodeValue, {
          format: "CODE128",
          lineColor: "#000000",
          width: 1, // Adjust the width for better barcode thickness
          height: 20, // Set the height of the barcode
          displayValue: true,
          fontSize: 8, // Adjust font size for the item info
        });
      } else {
        document.getElementById("barcode").innerText = "Barcode Unavailable";
      }

      // Display the item information
      const itemInfo = `
        ${itemName} <br>
        $${standardSellingRate}
      `;
      document.getElementById("item-info").innerHTML = itemInfo;
    });
  </script>
</body>
</html>