https://forum.jquery.com/topic/reload-dom-after-injecting-form-elements#14737000002044320

Just had an issue where I was using JQuery to add form fields to a page and when I would submit the form all the added fields were missing.

Some forums suggested that I check the validity of the html to make sure there was no badly nested tags. I did this and it still didn’t work.

Then I found the above secret… It recommends moving your form to be nested under body.

I moved my form to the out most area of my cake template and even though it was still nested in some divs necessary to running Twitter Bootstrap it started submitting the values correctly.

<?php 

# /View/Name/Action.ctp

<!-- put this to the outside so it's not nest in dozens of divs -->
<?php echo $this->Form->create('Label'); ?>

<!-- a heap of layout divs and input fields embedded from here -->
<div>
   <div>
      <div>
      </div>
   </div>
</div>

<!-- de-nest the </form> element too -->
<?php echo $this->Form->end(); ?>

MacOS Chrome: Version 54.0.2840.98 (64-bit)

CakePHP 2.8.7