Question

我正在将一组输入动态添加到HTML表单中并发布该表单，并希望将表单数据表示为对象数组

我有这个HTML表单输入组，用户可以克隆它，并将另一个重复的输入组添加到表单：

<div class="questions entry input-group col-xs-3">
  <input class="form-control" id="clue" name="questions[clue][]" type="text" placeholder="Enter Clue" />
  <input class="form-control" id="answer" name="questions[answer][]" type="text" placeholder="Enter Clue Answer" />
  <input class="form-control" id="hint1" name="questions[hint1][]" type="text" placeholder="Optional: Enter a hint" />
  <input class="form-control" id="hint2" name="questions[hint2][]" type="text" placeholder="Optional: Enter a second hint" />
  <button class="btn btn-success btn-add" type="button">
    <i class="fas fa-plus"></i>
  </button>
</div>

在POST上，表单数据表示如下：

questions: { 
  clue: [ 'clue_a', 'clue_b' ],
  answer: [ 'answer_a', 'answer_b' ],
  hint1: [ 'hint_a1', 'hint_b1' ],
  hint2: [ 'hint_a2', 'hint_b2' ] 
}

但是，我想要一些类似于以下内容的东西：

questions: [ 
  question: {
    clue:   'clue_a',
    answer: 'answer_a',
    hint1:  'hint_a1',
    hint2:  'hint_a2'
  },
  question: {
    clue:   'clue_b',
    answer: 'answer_b',
    hint1:  'hint_b1',
    hint2:  'hint_b2'
  }
}

Answer 1

如果要按问题对它们进行排序，则需要以正确的顺序将[]放在名称中：

name="questions[0][clue]"

…等等。

有没有一种方法可以将一组表单输入字段作为对象数组发布？

1 个答案: