How do I pass the changed hidden field value from ValidateForm JS function to MVC controller

Solution 1:

Regarding your case, you can use this method to send the updated value to your Controller:

We first change the type of your SignUp from submit to button and bind the validateForm to its onclick event :

@using (Html.BeginForm("ViewAch", "AchNew", FormMethod.Post, new { enctype = "multipart/form-data", id = "CreateACHForm"}))
{
    <label>First Name <span>*</span></label>
    @Html.TextBoxFor(m => m.FirstName, new { maxlength = 19, @class = "input-required form-control form-control-sm", id = "fname" })
    @Html.ValidationMessageFor(m => m.FirstName, "")
    <label>First Name <span>*</span></label>
    @Html.TextBoxFor(m => m.FirstName, new { maxlength = 19, @class = "input-required form-control form-control-sm", id = "fname" })
    @Html.ValidationMessageFor(m => m.FirstName, "")
    @Html.AntiForgeryToken();
    <input type="hidden" id="myTokenizedPayloadNonce" name="TokenizedPayloadNonce"/>
    <input type="button" value="SignUp" class="btn btn-primary btn-lg btn-block" onclick="validateForm()" />
 }

Once the binding is done, then we use Javascript to submit your form to the Controller. This will bind the updated value that you required to your Model:

function validateForm() {
    var NewToken = callExternalSytem(); // retrieving value from the external system
    document.getElementById('myTokenizedPayloadNonce').value  = NewToken;
    document.getElementById('CreateACHForm').submit();
}