How to post specific value with input type hidden-CodePudding

I have product number but first 3 digit specific, I want to enter user only last digit, I get first 3 digi from ejs <%= operatorDetails.operatorSerialNumber %> so how can I add new input value end of the specifc number and post this value.

I'm trying like this but I get error. productNoLastDigit get lastDgit and I want to post all number with productNo but value = part is not working.

<input type="text" name="productNoLastDigit"  id="lastDigit">                                                       
<input type="hidden" name="productNo" value="<%= operatorDetails.operatorSerialNumber %>    <script>document.write(document.getElementById('lastDigit').value)</script> " />

How can I do that ?

CodePudding user response：

It is not recommended to wirte JS code within input tages. You need js function so whenever productNoLastDigit is changed then append this with your previous digits and assign this new value to productNo.

    <input type="text" name="productNoLastDigit"  id="lastDigit" onChange="productNoLastDigitChange()"> 
<input type="hidden" name="productNo" value="<%= operatorDetails.operatorSerialNumber %>"/>



      function productNoLastDigitChange() {
        alert("ho")
    let val = document.getElementsByName("productNoLastDigit")[0].value;
    let val2 = document.getElementsByName("productNo")[0].value;
    val2 = val2.slice(0, 3)   val
    document.getElementsByName("productNo")[0].value = val2
}

CodePudding user response：

You can listen for change event on the #lastDigit input element and set the hidden input field value by slicing the first 3 digits and concatenating them with the changed value.

document.querySelector('#lastDigit').addEventListener('change', (e) => {
    let target_el = document.querySelector('input[name="productNo"]');
    let target_input_value = target_el.value;
    target_el = target_input_value.slice(0,3)   e.target.value;
});