привет, я использую форму для добавления опыта для пользователей, у которых есть кнопка добавления большего количества, которая добавляет больше (клонов) контента, а пользователи получают еще одно поле для добавления опыта
я использую этот код для достижения этого
<div id="append_palllsjjs"><div class="full_exp_9092k" id='duplicater'> <div class="full_one_row_009so"> <div class="obe_left_dibbhsy78"> <div class="header_009sos00dd_d"> Company Name <span>*</span> </div> <div class="maind_TAxefst67s77s"> <input type="text" name="comp[]" required placeholder="company Name" class='cname_990s_EXp'/> </div> </div><div class="obe_left_dibbhsy78"> <div class="header_009sos00dd_d"> Department Name <span>*</span> </div> <div class="maind_TAxefst67s77s"> <input type="text" name="dept[]" required placeholder="Department Name" class='cname_990s_EXp'/> </div> </div> </div><div class="full_one_row_009so"> <div class="obe_left_dibbhsy78"> <div class="header_009sos00dd_d"> From Date <span>*</span> </div> <div class="maind_TAxefst67s77s"> <input type="date" data-initial-day="1" data-initial-year="2011" data-initial-month="9" class='TEx_About_allihh' name="exsdate[]" required/> </div> </div><div class="obe_left_dibbhsy78"> <div class="header_009sos00dd_d"> To Date <span>*</span> </div> <div class="maind_TAxefst67s77s"> <input type="date" data-initial-day="1" data-initial-year="2012" data-initial-month="10" class='TEx_About_allihh' name="exedate[]" required/> </div> </div> </div><div class="full_one_row_009so"> <div class="obe_left_dibbhsy78"> <div class="header_009sos00dd_d"> Profile <span>*</span> </div> <div class="maind_TAxefst67s77s"> <input type="text" name="profile[]" required placeholder="Profile" class='cname_990s_EXp'/> </div> </div><div class="obe_left_dibbhsy78"> <div class="header_009sos00dd_d"> </div> <input type="button" name="addmore" value="Add More" class='button small white' onclick='duplicate();'/> </div> </div> </div></div> JS
var i = 0; var original = document.getElementById('duplicater'); function duplicate() { var clone = original.cloneNode(true); // "deep" clone clone.id = "duplicetor" + ++i; // there can only be one element with an ID original.parentNode.appendChild(clone); }
здесь я хочу, чтобы новые поля при добавлении должны быть пустыми (прямо сейчас он показывает тот же контент с предварительно заполненными значениями в текстовом поле)
вторая проблема – я хочу вставить данные в таблицу для каждого значения массива, я знаю, что это может быть donr byeach loop
PHP
$comps=$_POST['comp']; $profile=$_POST['profile']; $exedate=$_POST['exedate']; $exsdate=$_POST['exsdate']; $dept=$_POST['dept']; if(empty($comps) || empty($profile) || empty($exedate) || empty($exsdate) || empty($dept) ){ echo 'Please Fill all the fields marked with *';die; } foreach($comps as $value){ // insert into tablename (field1,field2,field3,...) values ('comp1','dep1','profile1'....)
// вставляем столько feilds, сколько no элементов в массиве}
пожалуйста, предложите мне этот код php, как использовать цикл foreach, чтобы я мог вставлять столько строк, сколько нет элементов в массиве с значениями, связанными с коррозией в другом массиве
просьба отметить, что на этот вопрос написано два вопроса, пожалуйста, не стесняйтесь помогать по любому вопросу.
один – wth php и anothr с ajax
Используйте следующий код для очистки клонированной формы:
ПРИМЕЧАНИЕ. Должен добавить файл jquery в документ.
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> <script> var i = 0; var original = document.getElementById('duplicater'); function duplicate(){ var clone = original.cloneNode(true); // "deep" clone i = ++i; clone.id = "duplicetor"+ i; // there can only be one element with an ID original.parentNode.appendChild(clone); clearCloneForm(clone.id); } function clearCloneForm(id){ var divId = '#'+id; $(divId).find("input[type^='text'], input[type^='date']").each(function() { $(this).val(''); }); } </script>
Вот код с вашим новым требованием:
Чтобы добавить кнопку удаления, если пользователь хочет удалить раздел блока формы, пользователь может легко:
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> <script> var i = 0; var original = document.getElementById('duplicater'); function duplicate(){ var clone = original.cloneNode(true); // "deep" clone i = ++i; clone.id = "duplicetor"+ i; // there can only be one element with an ID original.parentNode.appendChild(clone); addButton(clone.id,i); clearCloneForm(clone.id); } function clearCloneForm(id){ var divId = '#'+id; $(divId).find("input[type^='text'], input[type^='date']").each(function() { $(this).val(''); }); } function addButton(id,ii){ var divId = '#'+id; $(divId).append('<input type="button" value="Remove" class="button small white" id="'+ii+'" onclick="rBlock('+ii+')" />'); } function rBlock(ii){ $('#'+ii).on('click', function(e){ var parentDiv = $(this).parent(); if(parentDiv.attr('id') !== ii){ parentDiv.remove(); } }); $('#'+ii).trigger( "click" ); } </script>