How can i insert javascript variable in value dynamically?

this is the value in my input field

value="CODES-{{ date("Ym_M") }}-PRJ-PONUMBER-SHORTTEXT"

i have this variable in javascript

var codes = PC123; this is dynamic
var ponumber = 4124;this is dynamic
var shorttext = 001; this is dynamic

I want a result of:

//PC123-202105_May-PRJ-4124-001

thanks in advance guys.

Answer

Keep the date in a data-* attribute and then use javascript to set the input.

<input id="myInput" type="text" data-date="{{ date('Ym_M') }}">

var input = document.getElementById('myInput'); // or $('#myInput'); in JQuery
var codes = 'PC123';
var date = input.dataset.date; // or $('#myInput').data('date'); in JQuery
var ponumber = '4124';
var shorttext = '001';

input.value = `${codes}-${date}-PRJ-${ponumber}-${shorttext}`; // or $('#myInput').val(`${codes} .... `); in JQuery