Здравствуйте! Есть форма в которую с помощью JS добавляются поля по желанию (клику). Поля эти имеют некий input к которому привязывается jQuery.datetimepicker.
То есть выглядет это примерно так:
// ### Добавление допполей
var items=1;
function AddItem() {
table=document.getElementById("manuf");
button=document.getElementById("tbody");
buttontable=document.getElementById("table")[0];
items++;
newitem="<td><input name='name_manuf[]' class='form-control' type='text' value=''></td>";
newitem+="<td><input name='col_manuf[]' class='form-control' type='text' value='' ></td>";
newitem+="<td><input name='price_zakup_manuf[]' id='price_zakup_manuf"+items+"' class='form-control' type='text' value='' ></td>";
newitem+="<td><input name='procent_manuf[]' id='procent_manuf"+items+"' class='form-control' type='text' value='' ></td>";
newitem+="<td><input name='price_prod_manuf[]' id='price_prod_manuf"+items+"' class='form-control' type='text' value='' ></td>";
newitem+="<td><input name='nacenka_manuf[]' id='nacenka_manuf"+items+"' class='form-control' type='text' value='' ></td>";
newitem+="<td><input name='date_manuf[]' id='DateTeme"+items+"' class='form-control' type='text' value='' ></td>";
newitemJs="jQuery.datetimepicker.setLocale('ru'); jQuery('#DateTeme"+items+"').datetimepicker({timepicker:false, format:'Y.m.d', changeMonth: true, inline:false, onChangeDateTime:function(dp,$input){ var $text123 = $('#DateTeme"+items+"').val(); $('#DateTeme"+items+"').val($input.val())}});";
newnode=document.createElement("tr");
newnodeJs=document.createElement("script");
newnodeJs.innerHTML=newitemJs;
newnode.innerHTML=newitem;
newnodeall=newnode+=newnodeJs;
table.appendChild(newnodeall,button);
//table.insertBefore(newnodeJs,button);
// ### Проценты и наценка для допполей
get=document.querySelector.bind(document)
zakup=get("#price_zakup_manuf"+items)
percent=get("#procent_manuf"+items)
result=get("#nacenka_manuf"+items)
itogo=get("#price_prod_manuf"+items)
percent.oninput=function(){
result.value=percent.value*(zakup.value/100); // Наценка
itogo.value=(parseInt (result.value, 10)+parseInt (zakup.value, 10)); // Продажная цена
};
itogo.oninput=function(){
result.value=(parseInt (itogo.value, 10)-parseInt (zakup.value, 10)); // Продажная цена вручную
}
}
HTML который должен в идеале получиться:
<tbody id="manuf">
<tr>
<td>
<input name="inputHand" type="hidden" value="1">
<input name="name_manuf[]" class="form-control inputHand" type="text" value="">
</td>
<td>
<input name="col_manuf[]" class="form-control inputHand" type="text" value="">
</td>
<td>
<input name="price_zakup_manuf[]" id="price_zakup_manuf" class="form-control inputHand" type="text" value="">
</td>
<td>
<input name="procent_manuf[]" id="procent_manuf" class="form-control inputHand" type="text" value="">
</td>
<td>
<input name="price_prod_manuf[]" id="price_prod_manuf" class="form-control inputHand" type="text" value="">
</td>
<td>
<input name="nacenka_manuf[]" id="nacenka_manuf" class="form-control inputHand" type="text" value="">
</td>
<td>
<input name="date_manuf[]" id="DateTeme" class="form-control inputHand" type="text" value="">
<script type="text/javascript">
//### Дата
jQuery.datetimepicker.setLocale('ru'); // Дата
jQuery('#DateTeme').datetimepicker({
timepicker:false,
format:'Y.m.d',
changeMonth: true,
inline:false,
onChangeDateTime:function(dp,$input){
var $text123 = $('#DateTeme').val();
$("#DateTeme").val($input.val())
}
});
</script>
</td>
</tr>
<tr>
<td>
<input name="name_manuf[]" class="form-control" type="text" value="">
</td>
<td>
<input name="col_manuf[]" class="form-control" type="text" value="">
</td>
<td>
<input name="price_zakup_manuf[]" id="price_zakup_manuf2" class="form-control" type="text" value="">
</td>
<td>
<input name="procent_manuf[]" id="procent_manuf2" class="form-control" type="text" value="">
</td>
<td>
<input name="price_prod_manuf[]" id="price_prod_manuf2" class="form-control" type="text" value="">
</td>
<td>
<input name="nacenka_manuf[]" id="nacenka_manuf2" class="form-control" type="text" value="">
</td>
<td>
<input name="date_manuf[]" id="DateTeme2" class="form-control" type="text" value="">
<script type="text/javascript">
//### Дата
jQuery.datetimepicker.setLocale('ru'); // Дата
jQuery('#DateTeme2').datetimepicker({
timepicker:false,
format:'Y.m.d',
changeMonth: true,
inline:false,
onChangeDateTime:function(dp,$input){
var $text123 = $('#DateTeme2').val();
$("#DateTeme2").val($input.val())
}
});
</script>
</td>
</tr>
<tr>
<td>
<input name="name_manuf[]" class="form-control" type="text" value="">
</td>
<td>
<input name="col_manuf[]" class="form-control" type="text" value="">
</td>
<td>
<input name="price_zakup_manuf[]" id="price_zakup_manuf3" class="form-control" type="text" value="">
</td>
<td>
<input name="procent_manuf[]" id="procent_manuf3" class="form-control" type="text" value="">
</td>
<td>
<input name="price_prod_manuf[]" id="price_prod_manuf3" class="form-control" type="text" value="">
</td>
<td>
<input name="nacenka_manuf[]" id="nacenka_manuf3" class="form-control" type="text" value="">
</td>
<td>
<input name="date_manuf[]" id="DateTeme3" class="form-control" type="text" value="">
<script type="text/javascript">
//### Дата
jQuery.datetimepicker.setLocale('ru'); // Дата
jQuery('#DateTeme3').datetimepicker({
timepicker:false,
format:'Y.m.d',
changeMonth: true,
inline:false,
onChangeDateTime:function(dp,$input){
var $text123 = $('#DateTeme3').val();
$("#DateTeme3").val($input.val())
}
});
</script>
</td>
</tr>
</tbody>
Но, в итоге получаю ошибку: main-page.js:180 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
Помогите пожалуйста разобраться.
