трабла с добавлением элементов в div через innerHTML
Вот код:
function addjob() { document.getElementById('count_of_jobs').value = parseInt(document.getElementById('count_of_jobs').value) + 1; var html = '<tr class="create-po-line">'+ '<td class="list-view-head" align="right" colspan="3"></td><td>Cost</td>'+ '<td class="list-view-head">Qty</td><td><div id="head_addcol'+document.getElementById('count_of_jobs').value+'">Add. column</div></td>'+ '<td class="list-view-head">VAT</td><td>Supplier / A/C</td>'+ '</tr>'+ '<tr>'+ '<td class="context_login" align="right">Job name</td><td><input type="text" style="width:150px" id="Jobname'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '<td class="context_login" align="right">Cost Estimation</td><td><input type="text" style="width:100px" id="CE_Cost'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="CE_Qty'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="CE_Addcol'+document.getElementById('count_of_jobs').value+'" value="1" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="CE_VAT'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="CE_Supplier'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '</tr>'+ '<tr>'+ '<td class="context_login" align="right">Type</td>'+ '<td align="left"><select id="Type'+document.getElementById('count_of_jobs').value+' style="width:10px" class="input_text_login" id="Type'+document.getElementById('count_of_jobs').value+'"">'+ <? ///// добавление элементов ?> '</select></td>'+ '<td class="context_login" align="right">Purchase Order</td>'+ '<td><input type="text" id="PO_Cost'+document.getElementById('count_of_jobs').value+'" style="width:100px" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="PO_Qty'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="PO_Addcol'+document.getElementById('count_of_jobs').value+'" value="1" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="PO_VAT'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '<td><input type="text" style="width:100px" id="PO_AC'+document.getElementById('count_of_jobs').value+'" class="input_text_login" /></td>'+ '</tr>'; return html; } </script> и соответственно <input type="hidden" id="count_of_jobs" value="0" /> <input type="button" value="Add job" class="input_text_login" onclick="document.getElementById('po-content').innerHTML+=addjob();" > <table width="100%" border="0"> <div id="po-content"> </div> </table> проблема: скажем, я один раз нажал на Add Job..... вышли все новые ячейки - я их заполнил.... теперь, если я добавляю еще один Job, значение веденые в предыдущий раз очищаются. п.с. название темы надеюсь содержательно-понимательна получилась :) |
|
чуточку поясню:
при изменении свойства innerHTML(=,+=), элементы внутри тега создаются с нуля.все поэтому и обнуление происходит. для решения этой проблемы, используйте методы из вышеуказанной ссылки |
Часовой пояс GMT +3, время: 14:25. |