У меня есть пара полей ввода (заголовок ссылки, отчет о ссылках), которые пользователь может дублировать, чтобы включить несколько ссылок на запись, созданную при отправке формы, но я заметил, что, несмотря на то, что поля добавляются в массивсчетчик для имени, например reportLink[2]
дополнительные поля ссылки не включаются в тело при отправке формы, и мне было интересно, будет ли это связано с моим интерфейсным кодом или этот процесс является результатом серверной частиконфигурация кода.На данный момент все, что собрано в теле, это пара полей.
Вот мои поля:
<div class="form-group report-link-container p-2">
<label for="report-link">Link to Reports</label>
<p><i>Please make sure all visible URL fields contain http:// or https://. Otherwise you will receive an error</i></p>
<div class="annotation__footer-report-link-form-container">
<a href="#" class="btn btn-outline-primary setup-add-field mb-2">+ Add Another Report</a>
<br/>
<label for="report-title">Title</label>
<a href="#" class="setup-add-field">Add Another Report</a>
<div class="annotation__footer-report-link-form-container">
<input type="text" name="reportTitle[0]" class="form-control annotation-report-title" value=""placeholder="Title">
<input type="text" name="reportLink[0]" class="form-control annotation-report-link" value="" placeholder="Link">
</div>
</div>
</div>
jQuery для добавления дополнительных полей и счетчика имен:
//Append or remove form fields for report links
var formField = $('.report-link-container');
var i = $('.report-link-container p').size();
var fieldName = $('input.annotation-report-link')[0].name.replace('[0]', '');
var reportTitle = $('input.annotation-report-title')[0].name.replace('[0]', '');
var reportTitlePlaceholder = $('input.annotation-report-title')[0].placeholder;
var fieldPlaceholder = $('input.annotation-report-title')[0].placeholder;
var reportTitleCounter = 1;
var fieldCounter = 1;
$('.setup-add-field').on('click', function() {
$('<div class="annotation__footer-report-link-form-container"><div class="report-link-container"><p class="setup-form-field-wrapper"><a href="#" class="remove">Remove</a><label>Title</label><input type="text" class="form-control annotation-report-title" size="20" name="' + reportTitle + '['+ reportTitleCounter++ +']" value=""' + reportTitlePlaceholder + '" placeholder="Title"/><label>Link</label><input type="text" class="form-control annotation-report-link" size="20" name="' + fieldName + '['+ fieldCounter++ +']" value=""' + fieldPlaceholder + '" placeholder="Link"/></p></div></div>').appendTo(formField);
i++;
return false;
});
$('.report-link-container').on('click', '.remove', function() {
if (i >= 1) {
$(this).closest('.annotation__footer-report-link-form-container').remove();
i--;
}
return false;
});
Полученное тело независимо от того, добавляются ли дополнительные поля и присутствуют ли при отправке формы:
reportTitle[0]
reportLink[0]