how can I calculate with onchange and show it in table

Before answering the question and leaving the subject a bit I invite you to check Exit HTML of the PHP page since I see that you are concatenating all the HTML and that when writing pages with PHP can generate some illegibility and difficulty when writing code.

In the Javascript section also add code "online" (inline), in this way: onchange="onQtyChange(this.value);" is considered a bad practice but is valid and I will answer your question based on this form. Here is more information: Why Should I Avoid Inline Scripting? ( You can translate it from English).

All the above are only recommendations from me.

Now if with respect to your question you first need to make modifications to your HTML; to start the PHP code here is not relevant since your problem is about Javascript and not PHP, so it only leaves the final HTML that is shown to the user.

First: you must modify in your HMTL the id's cantidad-inicial , if you are going to have multiple rows remember that an id is unique and when using document.getElementById and you have several identical id's, the first one you find will always return. In this case we will change that attribute to class .

Second: to each cell Stock we add an attribute data- in this case we will call it stock . Why do this? If you look at your code when you get the stock from the innerHTML , when you change it, it will no longer be the same, that is, the total will no longer be the same each time the input changes.

and third: you need to modify onQtyChange(this.value); to onQtyChange(event); this allows us to access the object event of the element that calls it and this to be able to modify elements of the same row.

I leave the javascript code:

function onQtyChange(event) {
    var filaTr = event.target.parentElement.parentNode; // Elemento <tr> (fila actual)
    var stockTd = filaTr.querySelector('.cantidad-inicial'); // Elemento <td> (celda stock)
    var valor = parseInt(event.target.value);
    var cantidad = parseInt(stockTd.dataset.stock);
    var total = (cantidad - valor);
    stockTd.innerHTML = total;
}

In the previous code

filaTr : refers to the <tr> element, the row from which the <input/> is found, to which we are entering the values.

stockTd : is the element <td> , the cell stock of the current row ( filaTr ).

valor : just like in your question, the value of <input/> .

cantidad : the value of the attribute data-stock of cell <td> stock.

and total which is the value that would remain in the stock.

and the HTML:

<table class="table">
        <thead>
            <tr>
                <th>ID</th>
                <th>Nombre</th>
                <th>Stock</th>
                <th>ML</th>
                <th>Cantidad</th>
                <th>Agregar</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>PTDLC60</td>
                <td>Producto term DLC 60</td> 
                <td class="cantidad-inicial" data-stock="3">3</td>
                <td>60</td>
                <td>
                    <input type="number" min="1" max="3" class="form-control" id="cantidad_PTDLC60" name="cantidad" value="1" autocomplete="off" onchange="onQtyChange(event)">
                </td>
                <td class="text-center">
                    <button type="button" class="btn btn-info" onclick="onQtyChange('PTDLC60')">
                        <span class="icon-plus"></span>
                    </button>
                </td>
            </tr>
        </tbody>
    </table>

and I leave you a JSBin so you can try the above.