mandy
mandy

Reputation: 765

Form Submit using a Javascript to invoke webflow transition, doesn't take the updated value on form

I am trying to invoke a form submit using javascript (jquery) to invoke a webflow transition. It works and the submit invokes the desired transition. But, the updated radio button values is not reflected on the model object which is posted.

Here is the code:

<form:form method="post" action="#" commandName="infoModel" name="pageForm">
     <form:input type="input" path="testMsg" id="success" />
     <input type="button" id="clearSelections" value="Clear Selections">
     <div class="question"> 
         <h4><c:out value="${infoModel.questionInfo.description}"/> </h4>
         <form:radiobuttons  path="infoModel.answerId" 
              itemValue="answerId" itemLabel="answerDescription" items="${infoModel.answers}" delimiter="<br/>" />
     </div>

      <input type="submit" name="_eventId_saveQualitativeInput" value="Save" id="save" />

      $(document).ready(function() {
            $('#tabs').tabs();
            //Clear selections (copy is server-side)

            $('#clearSelections').click(function() {
            //$('input[type="radio"]').prop('checked', false);
            $('input[type="radio"]').removeAttr('checked');
            $('#save').trigger('click');
            });
       });
 </form:form>

The form:radiobutton, generates the below html:

 <div class="question"> 
    <h4>Is this a general obligation of the entity representing a full faith and credit pledge? </h4>
    <span>
       <input type="radio" checked="checked" value="273" name="infoModel.answerId" id="infoModel.answerId1">
       <label for="infoModel.answerId1">Yes</label>
    </span>

    <span><br>
         <input type="radio" value="274" name="infoModel.answerId" id="infoModel.answerId2">
         <label for="infoModel.answerId2">No</label>
     </span>
 <br> 
 <span class="error"></span>
</div>

The input id= "success" value is registered and when the control goes to the server, the value of input id= "success" is updated in the "infoModel" object. But the value of answerId is not updated on the "infoModel" object.

Thoughts if i am missing something in the form:radiobutton element or if there is something else wrong?

Thanks in advance!

EDIT::::::: Thanks mico! that makes sense. I stripped of some of the code first time to make it precise, but i have a list which is being used for building the radio-buttons, below is the code:

 <c:forEach items="${infoModel.list["index"]}" var="qa" varStatus="rowCount">
     <div class="question"> 
          <h4><c:out value="${question.questionInfo.description}"/> </h4>
          <form:radiobuttons  path="list["index"][${rowCount.index}].answerId" itemValue="answerId" itemLabel="answerDescription" items="${question.answers}" delimiter="<br/>" />
                <br> 
      </div> 
</c:forEach>

Could you please suggest how i could try this one out? NOTE: The same code works on a regular form submit on click of a button of type submit. Its the javascript form submit which is not working. I also tried to do whatever i want to do in javascript and then invoke the button.trigger('click'); form got submitted but the changes made on form in my javascript didnt reflect.

Upvotes: 1

Views: 2937

Answers (1)

mico
mico

Reputation: 12748

With commandName inside a form:form tag you set "Name of the model attribute under which the form object is exposed" (see Spring Documentation). Then in path you should tell the continuation of the path inside the model attribute.

With this said I would only drop the extra word infoModel from path="infoModel.answerId" and have it rewritten as path="answerId" there under the form:radiobutton.

Upvotes: 1

Related Questions