CakePHP-多行表单-使用JS添加输入，但仅第一个输入被提交

Question

I'm doing a CakePHP site, I have a form there, and the user should be able to add multirow inputs dynamically, with JavaScript. Let me simplify it: I generate the first input with this code:

echo $this->Form->input('Student.0.name');

So, when the user click on add more inputs - then I inject the HTML for this input - which is:

<div class="input required">
  <label for="Student1Name">Width</label><input name="data[Student][1][name]" id="Student1Name" type="text">
</div>

The HTML, generated from the CakePHP code is equal to the other one - except the "0" and "1", we have sequent number here. But, when I submit - I have only the first input data on the server ... as the other ones have never been submitted.

What am I wrong?

Answer 1

// some variables .. 
var currentlyStudentsCount = 1;

var oneStudentHtml = '<div class="input required"><label for="StudentstudentNumberName">Width</label><input name="data[Student][studentNumber][name]" id="StudentstudentNumberCountName" type="text"></div>';

$('#addStudent').on('click', function() {

  // and add the HTML for one more student .. 
  $('#moreStudentsWrapper').append(
    oneStudentHtml.replace(
      /studentNumber/g,
      currentlyStudentsCount
    )
  );

  // increment the current students count .. 
  currentlyStudentsCount++;
});