Я использую тип поля сетки выражения для канала: форма, позволяющая добавлять записи канала из внешнего интерфейса.
Два поля в сетке - это выпадающие списки.
Код ниже - это то, что генерируется при добавлении строк.
<table cellspacing="0" id="activities" class=" grid-input-form" data-grid-settings='{"grid_min_rows":0,"grid_max_rows":""}'>
<thead>
<tr>
<th class="first reorder-col"></th>
<th> Activity </th>
<th> Duration </th>
<th> Activity date </th>
<th class="last grid-remove"></th>
</tr>
</thead>
<tbody>
<tr class="no-results hidden">
<td class="solo" colspan="5"> No rows created
<input type="hidden" name="activities" value="" />
<a rel="add_row" href="">Add new row</a></td>
</tr>
<tr>
<td class="reorder-col"><span class="ico reorder"></span></td>
<td class="" data-fieldtype="select" data-column-id="1" data-row-id="506"><select name="activities[rows][row_id_506][col_id_1]" dir="ltr">
<option value="100" selected="selected">Bicycling (leisurely, 10-11.9 mph)</option>
<option value="200">Bicycling (moderate, 12-13.9 mph)</option>
<option value="250">Bicycling (vigorous, 14-15.9 mph)</option>
<option value="118">Aerobic dancing, low impact</option>
<option value="140">Aerobic dancing, strenuously</option>
<option value="89">Gymnastics</option>
<option value="230">Basketball game</option>
</select></td>
<td class="" data-fieldtype="select" data-column-id="3" data-row-id="506"><select name="activities[rows][row_id_506][col_id_3]" dir="ltr">
<option value="15" selected="selected">15</option>
<option value="30">30</option>
<option value="45">45</option>
<option value="60">60</option>
<option value="75">75</option>
<option value="90">90</option>
</select></td>
<td class="" data-fieldtype="date" data-column-id="5" data-row-id="506"><input type="text" name="activities[rows][row_id_506][col_id_5]" value="" rel="date-picker" data-date-format="%j/%n/%Y %H:%i" /></td>
<td><ul class="toolbar">
<li class="remove"><a href="#" rel="remove_row" title="remove row"></a></li>
</ul></td>
</tr>
<tr>
<td class="reorder-col"><span class="ico reorder"></span></td>
<td class="" data-fieldtype="select" data-column-id="1" data-row-id="507"><select name="activities[rows][row_id_507][col_id_1]" dir="ltr">
<option value="100" selected="selected">Bicycling (leisurely, 10-11.9 mph)</option>
<option value="200">Bicycling (moderate, 12-13.9 mph)</option>
<option value="250">Bicycling (vigorous, 14-15.9 mph)</option>
<option value="118">Aerobic dancing, low impact</option>
<option value="140">Aerobic dancing, strenuously</option>
<option value="89">Gymnastics</option>
<option value="230">Basketball game</option>
</select></td>
<td class="" data-fieldtype="select" data-column-id="3" data-row-id="507"><select name="activities[rows][row_id_507][col_id_3]" dir="ltr">
<option value="15" selected="selected">15</option>
<option value="30">30</option>
<option value="45">45</option>
<option value="60">60</option>
<option value="75">75</option>
<option value="90">90</option>
</select></td>
<td class="" data-fieldtype="date" data-column-id="5" data-row-id="507"><input type="text" name="activities[rows][row_id_507][col_id_5]" value="" rel="date-picker" data-date-format="%j/%n/%Y %H:%i" /></td>
<td><ul class="toolbar">
<li class="remove"><a href="#" rel="remove_row" title="remove row"></a></li>
</ul></td>
</tr>
<tr>
<td class="reorder-col"><span class="ico reorder"></span></td>
<td class="" data-fieldtype="select" data-column-id="1" data-row-id="508"><select name="activities[rows][row_id_508][col_id_1]" dir="ltr">
<option value="100" selected="selected">Bicycling (leisurely, 10-11.9 mph)</option>
<option value="200">Bicycling (moderate, 12-13.9 mph)</option>
<option value="250">Bicycling (vigorous, 14-15.9 mph)</option>
<option value="118">Aerobic dancing, low impact</option>
<option value="140">Aerobic dancing, strenuously</option>
<option value="89">Gymnastics</option>
<option value="230">Basketball game</option>
</select></td>
<td class="" data-fieldtype="select" data-column-id="3" data-row-id="508"><select name="activities[rows][row_id_508][col_id_3]" dir="ltr">
<option value="15" selected="selected">15</option>
<option value="30">30</option>
<option value="45">45</option>
<option value="60">60</option>
<option value="75">75</option>
<option value="90">90</option>
</select></td>
<td class="" data-fieldtype="date" data-column-id="5" data-row-id="508"><input type="text" name="activities[rows][row_id_508][col_id_5]" value="" rel="date-picker" data-date-format="%j/%n/%Y %H:%i" /></td>
<td><ul class="toolbar">
<li class="remove"><a href="#" rel="remove_row" title="remove row"></a></li>
</ul></td>
</tr>
</tbody>
</table>
<ul class="toolbar">
<li class="add"><a href="#" rel="add_row" title="Add new row"></a></li>
</ul>
Для инициализации select2 я использую готовый документ
$("select[name*='activities']").select2({
width: '100%',
});
Это работает при загрузке страницы. Проблема в том, что при добавлении новой строки два поля выбора отключены. Я попробовал предложения, но я не могу заставить их работать.
Может кто-нибудь, пожалуйста, помогите мне с этим.