Как очистить поля ввода, выделения и текстовое поле после клонирования - PullRequest
0 голосов
/ 27 июня 2019

Я создаю форму для выставляемого элемента, я хочу свежее текстовое поле. когда пользователь нажимает кнопку ADD

function fncAdd() { //ADD ROW AND CLONE
  var tb = document.getElementById('tbl');
  var tbody = document.createElement('tbody'); // fixed IE :>
  tb.insertBefore(tbody, null);
  var clone = document.getElementById('cln').cloneNode(true);
  tbody.insertBefore(clone, null);
}

function fncDelete() { //DELETE ROW
  var tb = document.getElementById('tbl');
  var del = tb.rows.length;
  if (del > 1) {
    tb.deleteRow(del - 1);
  }
}
<tr id="cln"> //CALL CLONE FUNCTION
  <div align="center">1</div>
  </td>
  <?php  //CONNECT DATABASE
         	include 'dbConfig.php';
         	$query = $db->query("SELECT * FROM accountcode ORDER BY acc_id ASC ");
         	$rowCount = $query->num_rows;
         	?>
  <td>
    <select id="accountcode"> //DROPDOWN 2ND BY AJAX
      <option value=""> - - Please select - - </option>
      <?php
          			if($rowCount > 0){
              			while($row=$query->fetch_assoc()){
                	echo '<option value="'.$row['acc_id'].'">'.$row['acc_name'].'</option>';
              			}
            		}else{
              			echo '<option value="">Accountcode not available</option>';
            		}
          			?>
    </select>
  </td>
  <td>
    <select id="item"> //DROPDOWN 2ND BY AJAX
      <option value=""> - - Select accountcode first - -</option>
    </select>
  </td>
  <td> //DETAIL BOX
    <textarea rows=4 cols=25 class="txtDETAIL" maxlength="100"> </textarea>
  </td>
  <td>
    <input type="text" class="txtAMOUNT" size="5"> //AMOUNT BOX
  </td>
  <td>
    <input type="text" class="txtUNIT" size="5"> //UNIT BOX
  </td>
  <td> //NOTE BOX
    <textarea rows=4 cols=15 class="note" maxlength="60">  </textarea>
  </td>
  <td> //UPLOADFILE FOR PICTURE OR STOCK
    <a href='upload.php?id={$row[' id="id" ']}'>CLICK</a>
  </td>
  </table>
  <p>
    <input type="button" value="ADD" onClick="fncAdd()"> //BUTTON ADD
    <input type="button" value="DELETE" onClick="fncDelete()"> //BUTTON DELETE
  </p>

У меня проблемы с созданием значения текстового поля, когда пользователь нажимает кнопку. Я хочу, чтобы функция клонирования не копировала старое значение из 1-й строки и столбца. NO может автоматически увеличиваться

как я могу это сделать

Пример

Ответы [ 2 ]

1 голос
/ 27 июня 2019

Для очистки данных формы, которые вы можете использовать,

document.getElementById("form1").reset();

Ваша форма должна выглядеть,

<form id="form1">
   <input .....
</form>
0 голосов
/ 27 июня 2019

Нужно знать, клонированный элемент имеет уникальные идентификаторы (например, добавить -1 и т. Д. К оригинальному идентификатору).

Кроме того, я недавно сделал это с помощью jQuery, однако я использовалstring.replace (regex, '');вместо этого метода.

О да, пример для редактирования в соответствии с вашей ситуацией:

var element = document.getElementById('id-of-element').cloneNode(true);

element.childNodes[x].nextSibling.childNodes[y].value = '';

document.getElementById('target-element').insertBefore(element, null);

С уважением,

...