Jquery .html() - IE problem
Столкнулся на днях с проблемой: в input полях на форме в IE 8 вместо пустых значений отображается следующий текст: "type = text".
Как оказалось невалидный html возвращает метод jQuery.html(), который в свою очередь использует св-во innerHTML. Браузер IE по-своему парсит исходный текст и опускает кавычки в атрибутах тэгов. В итоге получается вместо
Код:
<input type="text" name="xxx" value="">
Код:
<input value= type=text name=xxx>
Может кто-нибудь сталкивался с проблемой и может посоветовать пути обхода, не считая костылей с регулярными выражениями?
P.S. форма отображается в jQuery UI Dialog виджете, то есть содержимое диалога берется из div'a след. образом:
Код:
var htmlcode=$('#dialog-tpl').html();
в доке написано: For example, Internet Explorer sometimes leaves off the quotes around attribute values if they contain only alphanumeric characters. а пустой value приводится к 0 у него.
Кода вашего не знаю, но смысла получать форму таким образом не вижу. Для получения данных формы, независимо откуда, лучше используйте .serialize() или .serializeArray(). Если вам надо вывести повторно ту же форму из диалога, то просто перерендерите её или вынесите в отдельный блок для tmpl
У метода же даже
Кода вашего не знаю, но смысла получать форму таким образом не вижу. Для получения данных формы, независимо откуда, лучше используйте .serialize() или .serializeArray(). Если вам надо вывести повторно ту же форму из диалога, то просто перерендерите её или вынесите в отдельный блок для tmpl
Цитата: MrXaK
У метода же даже в доке написано: For example, Internet Explorer sometimes leaves off the quotes around attribute values if they contain only alphanumeric characters. а пустой value приводится к 0 у него.
Я в курсе, что такая проблема существует, читал эти доки. Вопрос был в другом.
Есть хтмл-страница вида:
Код:
<html>
<!--page content here-->
<div id="dialog-tpl" style="display:none">
<form action="" method="post">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="NAME" value=""></td>
</tr>
<tr>
<td>Age</td>
<td><input type="text" name="AGE" value=""></td>
</tr>
</table>
</form>
</div>
</html>
<!--page content here-->
<div id="dialog-tpl" style="display:none">
<form action="" method="post">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="NAME" value=""></td>
</tr>
<tr>
<td>Age</td>
<td><input type="text" name="AGE" value=""></td>
</tr>
</table>
</form>
</div>
</html>
Цитата: MrXaK
Для получения данных формы....
Данные формы мне не нужны.
Цитата: MrXaK
Если вам надо вывести повторно ту же форму из диалога, то просто перерендерите её или вынесите в отдельный блок для tmpl
поясните, пожалуйста, что-то не совсем понял..
www.w3.org/TR/html4/intro/sgmltut.html#attributes
Без костылей для IE - никак.
Вот готовый костыль можешь попробовать http://www.stevetucker.co.uk/innerxhtml.htm
Либо задай начальное значение для value
Цитата: arrjj
http://www.stevetucker.co.uk/innerxhtml.htm
этот линк посещал как-то, показалось громоздко. Что ж, буду использовать наверное регулярные выражения.
Спасибо всем за проявленный интерес!
Про tmpl я имел в виду следующее (у меня у самого так реализовано):
Код:
<script id="template-static" type="text/x-jquery-tmpl">
<form>
<fieldset>
<label for="name">111</label> <input type="text" name="name" id="name" value="${name}"/>
<br />
</fieldset>
</form>
</script>
<form>
<fieldset>
<label for="name">111</label> <input type="text" name="name" id="name" value="${name}"/>
<br />
</fieldset>
</form>
</script>
Код:
var templateStatic = $('#template-static');
$('#loginBtn').click(function() {
$('<div></div>')
.html('')
.attr({'id' : 'loginDialog', 'title' : 'blablabla'})
.appendTo($('body'));
$.tmpl(templateStatic, {'name' : 'blabla_name'}).appendTo($('#loginDialog'));
$('#loginDialog').dialog({buttons : {
'OK' : function() {
$.post(
...
)
}
});
});
$('#loginBtn').click(function() {
$('<div></div>')
.html('')
.attr({'id' : 'loginDialog', 'title' : 'blablabla'})
.appendTo($('body'));
$.tmpl(templateStatic, {'name' : 'blabla_name'}).appendTo($('#loginDialog'));
$('#loginDialog').dialog({buttons : {
'OK' : function() {
$.post(
...
)
}
});
});
Главный вопрос-то забыл) jQuery UI же позволяют из любого div'а сделать диалог)) Почему бы вам вашим кодом просто не добавить к dialog-tpl нужный title и не сделать .dialog() прямо над этим дивом? Без всякого копирования .html()?