Используя jQuery диалоговое окно UI (“уничтожает”), кладет элемент на неправильное место?
Я использую тему по умолчанию, но обычно потому что я нахожу whenver, я настраивал свою систему отлично (шрифты, цветные темы, и т.д., и т.д.) моя машина находит, что причина переформатирована. Кроме того, перемещаясь от контракта до контракта, просто легче использовать материал из поля, чтобы быть более продуктивным.
2 ответа
Да, это «особенность» ... ха-ха ... столкнулся с ней некоторое время назад. Вот несколько "ошибок", а затем действительно хакерский способ борьбы с ними (хотя и эффективный, если вы планируете иметь много подчиненных форм):
- Когда вы создаете диалог, jquery запоминает его и сохраняет в отдельном div, то никогда не вернет его обратно (да, документация заключается в том, что элемент никогда не возвращается туда, где он был)
- По моему опыту, если вы слишком много возитесь со скрытыми элементами после этого, вы можете сломать будущая функциональность диалогов. Лучше просто создать новое диалоговое окно из нового содержимого (особенно, если в вашем приложении их много ... кодирование каждой подчиненной формы вручную очень быстро утомительно).
- Если вы не можете повторно использовать div, вы ' мне придется их клонировать и переименовать их (это то, что я делаю ниже)
При закрытии диалогового окна фрагмент ниже «клонирует» содержимое диалогового окна, переименовывает его атрибут id, затем добавляет измененное содержимое в «sub_form_container», создавая таким образом бренд новый диалог / форма каждый раз, когда пользователь закрывает диалог. Надеюсь, это поможет!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link type="text/css" href="ui.css" rel="stylesheet" />
<script type="text/javascript" src="j.js"></script>
<script type="text/javascript" src='ui.js'></script>
<script type="text/javascript">
$(document).ready(function() {
newDialogs(2);
});
function newDialogs(idCounter) {
$('#d1').unbind().bind('click', function() {
$('#d'+ idCounter.toString()).dialog({close: function(event, ui){
var newSubForm = $('#d'+idCounter.toString()).clone();
idCounter += 1;
newSubForm.attr('id', 'd'+idCounter.toString()).attr('class', '').attr('style', '');
$('#sub_form_container').append(newSubForm);
newDialogs(idCounter);
$('ui-dialog').remove()
}
});
});
}
</script>
</head>
<body>
<h1>Element above</h1>
<div>
<div id='d1'>Activate dialog</div>
<div id='sub_form_container'>
<div id='d2'>Dialog content <input type='text' /></div>
</div>
</div>
<h1>Element below</h1>
</body>
</html>
Может быть, добавить немного code, иначе трудно сказать, где / почему ваш код может дать сбой
Вы могли бы просто сделать это так или иначе
<input id="text" name="textname" type="text">
<input
type="button"
value="Pop me up"
onclick="$('#text').clone().dialog({
modal:true,
close: function(event, ui) {
$('#text').val(this.value);
}
});"
>
Найдите образец http: // jsbin. com / ujema /