Erin Erin - 5 months ago 21
jQuery Question

Submitting information in a form field populated with Jquery

So I have a form with questions, each question has a value and the values are added up to get your "

score
". The score is displayed in an input field and when you submit it, it sends the information in the input fields (the score along with name and email). The problem im having is, even though the "
score
" field is visually updating, its not sending the information in the field. I have tried using both the
.attr
and
.val
and both update the field but don't sent the value.

$("input[name=score]").attr('value', score);

$("input[name=score]").val(score)


The only way I get it to send the information is when I enter the value manually, so I know that part of it is working, its just not seeing the value that the jquery fills in.

Update:
Here is the full code that does the calculating

$(document).ready(function(){

function calcscore(){
var score = 0;
$(".hs-input:checked").each(function(){
score+=parseInt($(this).val(),10);
});
$("input[name=score]").attr('value', score);
}
$().ready(function(){
$(".hs-input").change(function(){
calcscore()
});

$("input[name=score]").prop("readonly", true);

});


}); //end doc rdy

the form is quite long but the field in question is:

<input class="hs-input score" type="text" name="score" /><br>


I am using HubSpot for the form submission so I cant really see exactly what they are receiving, only that the score is blank unless I remove the "read only" and input into the field manually.

Answer

Just wanted to let everyone know I figured it out, I needed to add following into the form creation so that the value was updated just before submitting:

onFormSubmit($form){
    $('input[name="score"]').val(sum).change();
}

The .change() part at the end is the important thing to, it is required to update a form field for hubspot.

Comments