То ли я перепил, то ли чего, но никак не могу сделать replaceChild. Привожу полный код:
- Код: Выделить всё
<!DOCTYPE html>
<html><head>
<meta content="text/html; charset=windows-1251" http-equiv="Content-Type">
<title>Квитанция по счету</title>
<style>
.myTD {font-family: Times Roman, Verdana, Arial, Helvetica, sans-serif; font-size: 8px; }
input, textarea {border:#999 1px solid;}
.warning {border-color:red;}
#errors {display:none;}
</style>
<script type="text/javascript">
function mirror(txt) { document.getElementById(txt.name).innerHTML = txt.value;} //функция дублирования записей внесенных в поля на аналогичные поля в квитанции
function validate() {
var blockEr = document.getElementById("errors"); // это блок вывода ошибок заполнения
blockEr.style.display = "none"; // при начале проверки он скрыт
if (blockEr.getElementsByTagName("P").length>0) blockEr.removeChild(blockEr.getElementsByTagName("P")[0]); // если проверка повторная, то мы обнуляем предыдущие сообщения об ошибках
var receipt = document.getElementById("receipt"); // это таблица с нашей квитанцией
var errorLog = new Array; // иницилизируем лог найденых ошибок
var inp = receipt.getElementsByTagName("*"); // все узлы таблицы квитанции. Плата за TEXTAREA.
//inp = inp + bigText;
for (var i=0; i<inp.length; i++) { // цикл по всем узлам таблицы нашей квитанции
if(inp[i].tagName!="INPUT" && inp[i].tagName!="TEXTAREA") continue; //если узел не поле ввода, то смотрим следущий узел
inp[i].className = ""; // если проверка повторная у поля убираем сначала красную рамку
attr = inp[i].getAttribute("data-validator").split(" "); // делим строку какие проверки нужны этому полю
if (inp[i].getAttribute("data-validator").indexOf("required")!=-1 && inp[i].value == "") { // это поле пустое, но должно быть заполнено
inp[i].className="warning"; // данному полю присвоить класс с красной рамкой
errorLog.push("Поле " + inp[i].title + " должно быть заполнено!"); // добавить сообщение об ошибке поля в лог
continue; // остальное можно не проверять, переходим ко следущему полю
}
if (inp[i].getAttribute("data-validator").indexOf("digit")!=-1 && inp[i].value!=parseFloat(inp[i].value)) { // это цифровое поле, но там есть другие знаки
inp[i].className="warning"; // данному полю присвоить класс с красной рамкой
errorLog.push("В поле " + inp[i].title + " должны быть только цифры!"); // добавить сообщение об ошибке поля в лог
continue; // остальное можно не проверять, переходим ко следущему полю
}
if (inp[i].getAttribute("data-validator").indexOf("[")!=-1) { // есть ограничения кол-во знаков в поле
valAll = inp[i].getAttribute("data-validator").substring(inp[i].getAttribute("data-validator").indexOf("[") + 1, inp[i].getAttribute("data-validator").indexOf("]")); // находим текст внутри []
if (valAll.indexOf("-")!=-1) { // кол-во знаков в поле является диапазоном чисел ( иначе - см. ELSE )
diapason = valAll.split("-"); // отделим минимум диапазона от максимума
if ((parseFloat(diapason[0])>inp[i].value.length) || (parseFloat(diapason[1])<inp[i].value.length)) { // кол-во символов в поле не совпадает с нужным диапазоном
inp[i].className="warning"; // данному полю присвоить класс с красной рамкой
errorLog.push("В поле " + inp[i].title + " должно быть не больше " + diapason[1] + " символов!"); // добавить сообщение об ошибке поля в лог
}
}
else
{ // кол-во знаков в поле является определенным числом или набором чисел
val = valAll.split(" "); // делим все числа внутри [] разделенные пробелом (даже если число одно)
flag = true; // объявляем флаг проверки на соответствие кол-ва символов
for (v = 0; v<val.length; v++) { // цикл по числам проверки кол-ва знаков в поле
if (parseFloat(val[v]) == inp[i].value.length) flag = false; // кол-во знаков в поле совпало с числом проверки
}
if (flag) { // не одно из чисел проверки не совпало с кол-вом символов в поле. Флаг не изменился
if (val[0]) valAll = val.join(" или "); // если чисел несколько - склеим их для лога ошибки
errorLog.push("Кол-во символов в поле " + inp[i].title + " должно быть " + valAll); // добавляем ошибку в лог
inp[i].className="warning"; // данному полю присвоить класс с красной рамкой
}
}
} // закрываем проверку на кол-во знаков в поле
}// конец цикла. переходим к следущему полю
if (errorLog.length!=0) { // если в логе есть ошибки
var err = document.createElement("P"); // создадим элемент Р в блоке ошибок
err.innerHTML = errorLog.join("<br>"); // склеим все элементы массива лога ошибок и поместим его в созданный блок Р
document.getElementById("errors").appendChild(err); // добавим созданый блок Р в блок ошибок
document.getElementById("errors").style.display = "block"; // сделаем блок ошибок видимым
document.getElementById("printer").style.display = "block"; // сделаем кнопку создания квитанции видимой
} else { //валидация пройдена
document.getElementById("printer").value = "создать квитанцию";
document.getElementById("printer").onclick = printer();
}// конец вывода ошибок
} //конец функции
function printer() {
newTable = document.getElementById("receipt");
inp1 = document.getElementById("receipt").getElementsByTagName("*");
for (var ii=0; ii<inp1.length; ii++) {
if(inp1[ii].tagName == "INPUT" || inp1[ii].tagName == "TEXTAREA") {
spn = document.createElement("SPAN");
spn.innerHTML = inp1[ii].value;
inp1[ii].parentNode.replaceChild(inp1[ii], spn);
}
}
var newwin = window.open();
newwin.document.appendChild(newTable);
}
</script>
</head><body bgcolor="#ffffff">
<center>
<table width="570" bgcolor="#000000" border="0" cellpadding="0" cellspacing="0" id="receipt">
<tbody><tr><td>
<table width="570" border="1" cellpadding="3" cellspacing="0">
<tbody><tr>
<td valign="top" width="35%" align="right" bgcolor="#ffffff" height="255">
<br><br><font size="2"><p>Извещение</p>
<br><br><br><br><br><br><br><br><br><br><br>
<font size="1"><p>Кассир</p></font></font></td>
<td valign="middle" width="370" align="right" bgcolor="#ffffff" height="255">
<table width="100%"><tbody><tr><td align="center">
<font size="-1">
ИНН <input type="text" name="INN" maxlength="12" tabindex="1" data-validator="required digit [10 12]" title="ИНН" onChange="mirror(this)" style="width:135px;"> КПП <input type="text" name="KPP" maxlength="9" tabindex="2" data-validator="required digit [9]" title="КПП" onChange="mirror(this)" style="width:135px;">
<br><textarea rows="2" name="recipient" tabindex="3" title="получатель платежа" onChange="mirror(this)" wrap="virtual" style="width:100%;" data-validator="required [1-160]"></textarea>
<br><font size="1">получатель платежа</font>
</font></td></tr>
</tbody></table>
<table width="100%" bgcolor="#000000" border="0" cellpadding="0" cellspacing="0">
<tbody><tr><td bgcolor="#000000">
<table width="100%" border="1" cellpadding="3" cellspacing="0">
<tbody><tr bgcolor="#ffffff"><td colspan="4" valign="center" align="center"><font size="2">Расчетный счет №: <input type="text" maxlength="20" name="settlement_account" tabindex="4" data-validator="required digit [20]" title="Расчетный счет" onChange="mirror(this)" style="width:100px;"> БИК: <input type="text" name="BIK" maxlength="9" tabindex="5" data-validator="required digit [9]" title="БИК" style="width:100px;"></font></td></tr>
<tr bgcolor="#ffffff"><td colspan="4" valign="center" align="center" height="10"><font size="2">Кор. сч.: <input type="text" name="loro_account" maxlength="20" tabindex="6" data-validator="required digit [20]" title="Кор. сч." onChange="mirror(this)"></font></td></tr>
<tr bgcolor="#ffffff"><td colspan="4" align="center"><font size="2"><input type="text" name="FIO" tabindex="7" data-validator="required" title="Ф.И.О." onChange="mirror(this)" style="width:100%;"><br><input type="text" name="address" tabindex="8" title="адрес" onChange="mirror(this)" style="width:100%;" data-validator=""><br><font size="1">плательщик (ФИО, адрес)</font></font></td></tr>
<tr bgcolor="#ffffff">
<td colspan="2" width="50%" align="center"><font size="2">Вид платежа</font></td>
<td width="25%" align="center"><font size="2">Дата</font></td>
<td width="25%" align="center"><font size="2">Сумма</font></td>
</tr>
<tr bgcolor="#ffffff">
<td colspan="2" align="center"><font size="1"><textarea rows="2" name="details" tabindex="9" data-validator="required" title="Вид платежа" onChange="mirror(this)" wrap="virtual" style="width:160px;"></textarea></font></td>
<td align="center"> </td>
<td align="center"><font size="2"> <input style="width:70px;" type="text" name="sum" tabindex="10" data-validator="required" title="сумма" onChange="mirror(this)"></font></td>
</tr>
<tr bgcolor="#ffffff">
<td colspan="2" rowspan="2" align="left"><font size="2">Плательщик:</font></td>
<td align="center"><font size="1">Пеня:</font></td>
<td align="center"><br></td>
</tr>
<tr align="center" bgcolor="#ffffff">
<td><font size="1">Всего:</font></td>
<td><br></td>
</tr>
</tbody></table>
</td></tr></tbody></table>
</td>
</tr>
<tr>
<td valign="top" width="200" align="right" bgcolor="#ffffff" height="255"><br><br><font size="2"><p>Квитанция</p><br><br><br><br><br><br><br><br><br><br><br>
<font size="1"><p>Кассир</p></font></font></td>
<td valign="middle" width="370" align="right" bgcolor="#ffffff" height="255">
<table width="100%"><tbody><tr><td align="center">
<font size="-1">
ИНН <span id="INN"></span> КПП <span id="KPP"></span>
<br><u><span id="recipient"></span>
</u><br><font size="1">получатель платежа</font>
</font></td></tr>
</tbody></table>
<table width="100%" bgcolor="#000000" border="0" cellpadding="0" cellspacing="0">
<tbody><tr><td bgcolor="#000000">
<table width="100%" border="1" cellpadding="3" cellspacing="0">
<tbody><tr bgcolor="#ffffff"><td colspan="4" valign="center" align="center"><font size="2">Расчетный счет №: <span id="settlement_account"></span> БИК: <span id="BIK"></span></font></td></tr>
<tr bgcolor="#ffffff"><td colspan="4" valign="center" align="center" height="10"><font size="2">Кор. сч.: <span id="loro_account"></span></font></td></tr>
<tr bgcolor="#ffffff"><td colspan="4" align="center"><font size="2"><span id="FIO"></span>,<br><span id="address"></span><br><font size="1">плательщик (ФИО, адрес)</font></font></td></tr>
<tr bgcolor="#ffffff">
<td colspan="2" width="50%" align="center"><font size="2">Вид платежа</font></td>
<td width="25%" align="center"><font size="2">Дата</font></td>
<td width="25%" align="center"><font size="2">Сумма</font></td>
</tr>
<tr bgcolor="#ffffff">
<td colspan="2" align="center"><font size="1"><span id="details"> </span></font></td>
<td align="center"> </td>
<td align="center"><font size="2"> <span id="sum"> </span></font></td>
</tr>
<tr bgcolor="#ffffff">
<td colspan="2" rowspan="2" align="left"><font size="2">Плательщик:</font></td>
<td align="center"><font size="1">Пеня:</font></td>
<td align="center"><br></td>
</tr>
<tr align="center" bgcolor="#ffffff">
<td><font size="1">Всего:</font></td>
<td><br></td>
</tr>
</tbody></table>
</td></tr></tbody></table>
</td>
</tr>
</tbody></table>
</td></tr></tbody></table>
<hr size="1" width="570" noshade="noshade">
<div id="errors">
<font color="red">Возможны ошибки!!!</font> <br>
</div>
<input type="button" value="проверить правильность" onClick="validate()" tabindex="11" id="validation">
<input type="button" value="нет, я уверен" onClick="printer()" style="display:none;" tabindex="12" id="printer">
</center></body></html>
Он ещё до конца не дописан, ну да и хрен бы с ним. Не могу заставить работать функцию
printer(). Точнее, то место, где должны заменятся
inputы на
spanы. Говорит, зараза, ноды нету.
P.-S. То что код кривоват и скрипт неоптимизирован - не писать, и сам знаю.
P.P.-S. insertBefore, с последущим ремувом пробовал - не делает и ошибок не выдает. Ремув и аппенд прокатывает, но если если у парента не больше одного чаилда инпута.