Set Input Value to jQuery Variable

Question

I'm trying to set an input field to the value of a jQuery variable but it's refusing to cooperate. Can someone please tell me what I'm doing wrong? Essentially, I'm trying to get equipment failure counts to display in an input textbox so I can write the value back to a table. Each failure counts as 1 and is added to a total (truckFailsTot variable) when users click a Y/N radio button next to each type of failure. The example below just includes one failure for brevity.

HTML

div class="form-row">
    <div class="form-group col-lg-12"><label class="col-form-label" for="TruckFailCount">TruckFailCount</label> 
<input class="form-control" ${disabled( 'TruckFailCount')} id="TruckFailCount" maxlength="13" name="TruckFailCount" title="truckFailCount" type="text" value="${row.truckFailCount?html}" /> 
    </div>
</div>

jQuery - I've commented out my failed attemps below. It seems like such a simple thing, yet nothing is working.

    jQuery('body').on("change",'#TruckAirCompressor',function(){
        
         if (this.value == "Fail") {
             fail_TruckAirCompressor = 1;
    
         } 
         else if (this.value == "Pass") { 
             fail_TruckAirCompressor = 0;
             
         }
         else { 
    
         }
        
        
        truckFailsTot = fail_TruckAirCompressor + fail_TruckAirLines + fail_TruckBattery 
            + fail_TruckBeltsHoses + fail_TruckBody + fail_TruckBrakesAccessories + fail_TruckBrakesParking
            + fail_TruckBrakesService + fail_TruckClutch + fail_TruckCouplingDevicesHitch 
            + fail_TruckDefrosterHeater + fail_TruckDriveLine + fail_TruckExhaustMuffler
            + fail_TruckFluidLevels + fail_TruckFuelTanks + fail_TruckHorn + fail_TruckLights
            + fail_TruckMirrors + fail_TruckSafetyEquipment + fail_TruckSteeringMechanism
            + fail_TruckTiresRimsWheels + fail_TruckWindows + fail_TruckWindshieldWipers;


        //  var t = truckFailsTot;
        //  $('#TruckFailCount').value(t);
        //  document.getElementById("#TruckFailCount").innerHTML=t;

        //   var val1 = truckFailsTot;
        //  $('#TruckFailCount').val(val1);

        //   var fooBar = 1;
        //  $('#TruckFailCount').val(fooBar);

    });

Thanks in advance!

check if this ever gets called by adding a console.log or an alert somewhere in the callback function — Cornel Raiu
– Cornel Raiu, Commented Aug 5, 2022 at 23:56
The code that sets the value is commented out. If that's not your actual code, post the real thing. — Barmar
– Barmar, Commented Aug 6, 2022 at 0:39
@Barmar, yes, I had added 1=1 earlier but took it out and forgot to remove from the sample. Please disregard. Regarding the commented out code, it contains the different variations I'd tried. None of them worked. — Wonderland Alice
– Wonderland Alice, Commented Aug 6, 2022 at 13:05
@CornelRaiu, yes, I've added alerts there and they are triggering. The value just isn't being set, which I can't figure out. — Wonderland Alice
– Wonderland Alice, Commented Aug 6, 2022 at 13:07

Wonderland Alice · Accepted Answer · 2022-08-09 01:27:33Z

1

I stumbled upon the correct syntax needed to assign a jQuery variable to an input text field and wanted to update my question in case someone else runs across a similar issue. All the jQuery documentation I'd come across recommended setting the value of the input field using .val(). Doing so didn't work for me, but the below code did.

var truckFailsTot;
truckFailsTot = fail_TruckAirCompressor + fail_TruckAirLines + fail_TruckBattery;
document.getElementById("TruckFailCount").value = truckFailsTot;

answered Aug 9, 2022 at 1:27

Wonderland Alice

651 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Set Input Value to jQuery Variable

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related