Getting data from a current HTML, PHP form using JavaScript

Question

I have a HTML/PHP sale form which I take in all the details of a sale(products, price etc.). When I "hold" the sale I then pass the id of the sale, using PHP like the following:

<button type="submit" class="btn btn-primary pull-right btnPrintOrder" saleCode="<?php echo $code; ?>" value="hold" name="openTable">Hold</button>

The desired end result is it is supposed to set off a function to print out the sale details to seperate printers(bar/restaurant). The print function works as I have tested it against older sales already saved to the database. My problem is it is not registering the details of the current sale and the receipts are blank. I have tried to put a delay on it to see could it pick the details up after they have been saved to the database but I'm not having any luck.

The function the button passes to is:

$(".saleForm").on("click", ".btnPrintOrder", function(){

    var saleCode = $(this).attr("saleCode");

    // setTimeout(food(saleCode), 50000);
    // setTimeout(drink(saleCode), 50000);

    window.open('extensions/tcpdf/pdf/food_order.php?code='+saleCode);
    window.open('extensions/tcpdf/pdf/drink_order.php?code='+saleCode);

})

And the PHP code calling the details in drink_order.php is:

public function getDrinkReceiptPrinting(){

// Sale Info
$itemSale = "code";
$saleValue = $this->code;

$saleAnswer = OpenTableController::ShowTableController($itemSale, $saleValue);

$saledate = substr($saleAnswer["date"],0,-8);
$products = json_decode($saleAnswer["products"], true);

$findCategory = 2;

$catProducts = array_filter($products, function ($product) use ($findCategory) {
    return $product['category'] == $findCategory;
});

$netPrice = number_format($saleAnswer["netPrice"],2);

//User Info
$itemUser = "id";
$userValue = $saleAnswer["idSeller"];

$userAnswer = UserController::ShowUsersController($itemUser, $userValue);

Any ideas would be great.

Answer 1

Change the PHP button attribute to this:

<button type="submit" class="btn btn-primary pull-right btnPrintOrder" data-sale-code="<?php echo $code; ?>" value="hold" name="openTable">Hold</button>

use data attribute ( dataset attribute), since saleData is not standard attribute, and inside jQuery use .data() to get the value (note how to get it in jQuery):

$(".saleForm").on("click", ".btnPrintOrder", function(){

    var saleCode = $(this).data("sale-code");

    // setTimeout(food(saleCode), 50000);
    // setTimeout(drink(saleCode), 50000);

    window.open('extensions/tcpdf/pdf/food_order.php?code='+saleCode);
    window.open('extensions/tcpdf/pdf/drink_order.php?code='+saleCode);

})