JavaScript を使用xmlhttp
してフォームに別の項目を追加しています。ユーザーが「ラインアイテムの追加」ボタンを何度も押して、フォームが不要なラインアイテムから空の値を投稿しようとしないように、ラインアイテムを削除する方法を見つけようとしています。
これを行う方法がわかりません。 remove() と関係があると思いますが、組み込む方法がわかりません。
これが私のJavaScriptコードです
<script type="text/javascript">
var counter = 1;
function addInput(div){
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
var newdiv = document.createElement(div);
var splitResponse = xmlhttp.responseText.split( "[BRK]" );
var firstDropdownContent = splitResponse[0];
var secondDropdownContent = splitResponse[1];
newdiv.innerHTML = "<table><tr><td><img style='background:#ffffff; float:left; ' src='../../images/spacer_icon.png'>Item " + (++counter) + "</td><td>Quantity</td><td>Description</td><td>Amount</td><td><img style='background:#ffffff; float:left; ' src='../../images/spacer_icon.png'>Tax Rate</td></tr><tr><td width='190'><select name='item[]'><option value='' selected></option>" + (firstDropdownContent) + "</select></td><td width='90'><input name='quantity[]' type='text' size='5' /></td><td width='440'><input name='description[]' type='text' size='60' /></td><td width='120'><input name='amount[]' type='text' size='6' /></td><td><select name='taxid[]'><option value='' selected></option>" + (secondDropdownContent) + "</select></td></tr></table><br />";
}
document.getElementById(div).appendChild(newdiv);
}
xmlhttp.open("GET", "invoicedropdownquery.php", false);
xmlhttp.send();
}
</script>
これが私のボタンです
<input type="button" value="Add Line Item" onClick="addInput('dynamicInput');">
そして、div を使用して配置します。
<div id="dynamicInput"></div>
ご協力いただける場合は、事前に感謝します。おそらく、各行項目の横に gif を配置して削除するだけです。
編集: これは JavaScript 内の html で、少し読みやすくなっています。
<table><tr>
<td><img style='background:#ffffff; float:left; ' src='../../images/spacer_icon.png'>Item " + (++counter) + "</td>
<td>Quantity</td>
<td>Description</td>
<td>Amount</td>
<td><img style='background:#ffffff; float:left; ' src='../../images/spacer_icon.png'>Tax Rate</td></tr>
<tr><td width='190'><select name='item[]'><option value='' selected></option>" + (firstDropdownContent) + "</select></td>
<td width='90'><input name='quantity[]' type='text' size='5' /></td>
<td width='440'><input name='description[]' type='text' size='60' /></td>
<td width='120'><input name='amount[]' type='text' size='6' /></td>
<td><select name='taxid[]'><option value='' selected></option>" + (secondDropdownContent) + "</select></td></tr></table><br />