我有一个SheepIt形式的车辆，每个车辆可以具有任意数量（0-无限）的站点。车辆具有类型，注释和（任意数量）停靠点。站点有日期，时间和位置。
这是我的SheepIt代码：
var sheepit_vehicles = jQuery("#vehicle_types").sheepIt({
separator: '',
allowRemoveLast: true,
allowRemoveCurrent: true,
allowAdd: true,
// Limits
minFormsCount: 1,
iniFormsCount: 1,
nestedForms: [
{
id: 'vehicle_types_#index#_stops',
options: {
separator: "",
indexFormat: '#index_stops#',
minFormsCount: 2,
iniFormsCount: 2,
afterAdd: function(source, newForm) {
addStop(source, newForm);
jQuery(".timepicker").timepicker({interval: 15, timeFormat: 'h:mm p'});
}
}
}
]
,
data: [{
'lead_vehicle_id': '34',
'vehicle_type': '1028',
'vehicle_note': '',
'vehicle_stop_dates[#index#][#index_stops#]': ['2018-08-26', '2018-08-26', '2018-08-26']
}, {
'lead_vehicle_id': '35',
'vehicle_type': '1027',
'vehicle_note': 'ABC',
'vehicle_stop_dates[#index#][#index_stops#]': ['2018-08-27', '2018-08-27']
}
]
});
关键是末尾的data元素。我根本无法弄清楚如何格式化JSON data元素以正确填充。
我用于jQuery插件的文件已被修改based upon my previous StackOverflow questions，但可以在此处找到https://yt074.addons.la/js/jquery.sheepItPlugin-modified.js
注入（数据填充）代码是fillForm函数，在该函数的行977上。我在下面包括了函数本身：
function fillForm(form, data)
{
var x = 0;
// For each element, try to get the correct field or fields
$.each(data, function(index, value) {
var formId = source.attr('id');
var formIndex = form.data('formIndex');
// Replace form Id and form Index with current values
if (index.indexOf('#form#') != -1 || index.indexOf('#index#') != -1) {
index = index.replace('#form#', formId);
index = index.replace('#index#', formIndex);
} else {
index = formId + '_' + formIndex + '_' + index;
}
/**
* Search for field (by id, by name, etc)
*/
// Search by id
var field = form.find(':input[id="' + index + '"]');
// Search by name
if (field.length == 0) {
// Search by name
field = form.find(':input[name="' + index + '"]');
if (field.length == 0) {
// Search by name array format
field = form.find(':input[name="' + index + '[]"]');
}
// Search by name without the form data (Michael Yingling hack for broken radio buttons)
if(field.length == 0) {
var name = index.replace(formId, '').replace('_'+formIndex+'_', '');
field = form.find(':input[name="' + name + 's[' + formIndex + ']"]');
}
}
if (field.length == 0) {
field = form.find('select[id="' + index + '"]');
if (field.length == 0) {
var last_underscore = index.lastIndexOf("_")+1;
var token = index.substring(last_underscore, index.indexOf("-", last_underscore));
field = form.find('select[id="' + index.replace(token+'-value-trigger', 'trigger-trigger-'+token) + '"]');
}
}
// Field was found
if (field.length > 0) {
// Multiple values?
var mv = false;
if (typeof(value) == 'object') {
mv = true;
}
// Multiple fields?
var mf = false;
if (field.length > 1) {
mf = true;
}
if (mf) {
if (mv) {
var fieldsToFill = [];
fieldsToFill['fields'] = [];
fieldsToFill['values'] = [];
x = 0;
for (x in value) {
fieldsToFill['fields'].push(field.filter('[value="'+ value[x] +'"]'));
fieldsToFill['values'].push(value[x]);
}
x = 0;
for (x in fieldsToFill['fields']) {
fillFormField(fieldsToFill['fields'][x] , fieldsToFill['values'][x]);
}
} else {
fillFormField( field.filter('[value="'+ value +'"]', value) );
}
} else {
if (mv) {
x = 0;
for (x in value) {
fillFormField(field, value[x]);
}
} else {
fillFormField(field, value);
}
}
}
// Field not found in this form try search inside nested forms
else {
if ( typeof(form.data('nestedForms')) != 'undefined') {
if (form.data('nestedForms').length > 0) {
x = 0;
for (x in form.data('nestedForms')) {
if (index == form.data('nestedForms')[x].attr('id') && typeof(value) == 'object') {
form.data('nestedForms')[x].inject(value);
}
}
}
}
}
});
}
答案 0 :(得分：1)
您有以下“表格”：
父表-ID：vehicle_types；级别：1
子表单-ID：vehicle_types_#index#_stops；等级：2（以等级1的形式嵌套）
在每种表单中，SheepIt插件都希望每个表单字段（例如<input>）的id都采用以下格式：{FORM ID}_{INDEX FORMAT}_{DATA KEY}；例如vehicle_types_#index#_notes用于“注释”字段，其中{FORM ID}是vehicle_types，{INDEX FORMAT}是#index#，而{DATA KEY}是notes。
然后插件将从{DATA KEY} 数组中读取data值。
所以data格式是：
[{ // Item 1
'{DATA KEY}': 'value',
'{DATA KEY}': 'value',
...
},
{ // Item 2
'{DATA KEY}': 'value',
'{DATA KEY}': 'value',
...
},
...]
对于每个子表格/嵌套表格，只需添加嵌套的array /数据，如下所示：
[{ // Item 1
'{DATA KEY}': 'value',
'{DATA KEY}': 'value',
...
'{CHILD FORM ID}': [{
'{DATA KEY}': 'value',
'{DATA KEY}': 'value',
...
},
...]
},
...]
{CHILD FORM ID}是强制性的，在您的情况下，它是vehicle_types_#index#_stops。
例如，停止日期字段的id是vehicle_types_#index#_stops_#index_stops#_stop_date，这意味着{DATA KEY}是stop_date。
通过示例字段（“ Notes”和“ Stop Date”字段），您的data数组将如下所示：
[{
'notes': 'Notes 1',
'vehicle_types_#index#_stops': [{
'stop_date': '2018-09-24'
}, {
'stop_date': '2018-09-25'
}]
}, {
'notes': 'Notes 2',
'vehicle_types_#index#_stops': [{
'stop_date': '2018-09-23'
}]
}]
查看完整的data和演示here。
在演示中，我仅链接到modified SheepIt插件-您同时链接了该插件的修改版和原始版。但是请注意，我实际上没有对SheepIt插件进行任何修改。
我更正了“车辆类型”字段的for和id-您使用了vehicles_#index#_type，并将其更改为vehicle_types_#index#_type。与“停止类型”字段（子/嵌套形式）相同—您使用了vehicle_stop_types_#index#_#index_stops#，我将其更改为vehicle_types_#index#_stops_#index_stops#_stop_type。可能还需要其他修复程序（也许是隐藏字段的id ？，但是您需要自己进行修复。.=）