peter88uk
peter88uk

Reputation: 327

Getting data from generated form in jquery

I have the following code setup:

http://jsfiddle.net/bABHU/2/

Had to change it a little bit to get it all on jsfiddle but the problem i'm having is the data from the first from gets put into the query string to send off to the ajax call, but the form elements generated after that (which comes from a JSON call) don't get submitted when clicking the next button again.

So when you get to the second question how can I submit the 'answer' input that was generated. - see the console for the outputs.

Hope that makes sense.

Any help is appreciated.

Thanks.

Upvotes: 0

Views: 65

Answers (2)

Jeff Watkins
Jeff Watkins

Reputation: 6359

When you replace the markup for findOptionsInner, you obliterate the form itself. Hence it not serializing. Also, you have no close tag for your form.

<form action="" method="post" name="formStep" id="formStep">
<div class="FinderOptionsInner">
    <p>
    <label class="label_check">
      <input type="radio" name="answer" value="1" id="answer_0" />
      Answer 1</label>
    <br />
    <label class="label_check">
      <input type="radio" name="answer" value="2" id="answer_1" />
      Answer 2</label>
    <br />
  </p>
</div>
</form>

<div class="nextButton-step1 nextButton">Next
</div>

Works just fine (notice that I've also fixed the close tags for form and the div at the bottom).

Upvotes: 1

moribvndvs
moribvndvs

Reputation: 42497

This is happening because you are replacing your entire <form> element with the new HTML content from question 2. Replace $('.FinderOptionsInner').html with $('#formStep').html

See http://jsfiddle.net/M3eZp/1/

Upvotes: 2

Related Questions