DOM манипуляции с ответом сервера.
Может меня заносит, и я снова усложняю себе жизнь...
Значит так, по аджакс-запросу сервер возвращает какой-то результат в виде куска html кода. Из этого куска надо вырезать div с класом xyz и вставить его определенный div. (Он уже есть в загруженном документе.) А все "остальное" в другой div. Может такая нарезка черезчур ... Если есть какие-то другие более умные идеии, буду рад выслушать.:) |
var data = $(data); // data - ответ от сервера
$('div.xyz', data).appendTo(div1); // div1 - куда будем вставлять div.xyz
data.appendTo(div2); // div2 - куда будем вставлять все остальное.
|
Цитата:
|
Например?
Упаковать в json? А так можно? |
Что значит можно? Возвращайте в удобном для вас виде, кому какая разница.
|
Я имею в виду, что сама разметка не "пострадает"?
Если в данных есть скрипт. Дополнительные нагрузки на сервер при упаковку в json меня также беспокоят. Ну и, есть ли какой-то способ отравить как ответ сервера несколько данных (которые можно рассортировать по дивах), кроме как упаковать их в json. Я же потому и спрашиваю. |
Можно готовый HTML возвращать :-?
|
Цитата:
|
Может без вырезания обойтись? А возвращать только то что нужно вставить?
|
А если в одни див надо вставить одно, а в другой-другое?
Например, данные с сервера подгружаются в плавающий див. (Т.е. диалоговое окно. Просто я хочу, чтобы тег с <h1> стал заголовком всего окна. |
Цитата:
|
Что-то не работает.
...function(data)
{
var sret = $(data);
$('h2', sret).appendTo('#dh2');
$('#ajaxload').stop().fadeOut(500);
// $(sret).appendTo('#ajaxcontent');
$('#ajaxcontent').stop().fadeIn(500);}...
Ровным счетом ничего не происходит. Во-вторых, appendTo добавляет данные, к уже имеющимся, а мне нужно замещать. Смотрел по доккументации функцию replaceAll но она не произвдит никаких видимых изменений. |
А полностью код обработчика покажите? И то что в data ajax-ом возвращается?
По поводу замещения.. сначала почистите содержимое, а затем вставьте нужное. |
function loadform(a)
{$.ajax({url:a['href'],beforeSend:function(){opendlg();$('#ajaxload').fadeIn(500);$('#ajaxcontent').hide();},success:
function(data)
{
var sret = $(data);
$('h2', sret).appendTo('#dh2');
$('#ajaxload').stop().fadeOut(500);
$(sret).appendTo('#ajaxcontent');
$('#ajaxcontent').stop().fadeIn(500);}})}
<div class="popup" id="dialog" style="display:none; z-index:10000">
<div id="dh2"> </div>
<div id="ajaxload">
<div style="text-align:center">
<?= image('ajaxload') ?>
<br clear="all" /><br clear="all" />
<h3>Пожалуйста подождите, идет обработка данных........</h3>
</div>
</div>
<div id="ajaxcontent">
</div>
</div>
А возвращаем мы, к примеру, это
<h2>create tags</h2>
<script type="text/javascript">
$().ready(function() {
// validate signup form on keyup and submit
$("#tag").validate({
submitHandler: function(){formgears('#tag');}});
})
</script>
<form action="<?= part_url('edt/savetags.htm') ?>" method="POST" id="tag">
<div class="field">
<?= form_labelinput('title', $title , 'tag_title') ?>
</div>....
Кстати,
$(sret).appendTo('#ajaxcontent');
Работает. но
$('h2', sret).appendTo('#dh2');
НЕТ.Пробовал вставлять все, потом вырезать - так работает, но как-то некрасиво. |
Странно.
$('.field', sret).appendTo('#dh2');
работает.Если весь кусок возвращаемого кода "обернуть" в div тогда все нормально. Почему так?
<div>
<h2>create tags</h2>
<script type="text/javascript">
$().ready(function() {
// validate signup form on keyup and submit
$("#tag").validate({
submitHandler: function(){formgears('#tag');}});
})
</script>
<form action="<?= part_url('edt/savetags.htm') ?>" method="POST" id="tag">
<div class="field">
<?= form_labelinput('title', $title , 'tag_title') ?>
</div>
<div class="field">
<?= form_labelinput('tag', $tag, 'tag_tag') ?>
<div class="notice"><?= lang('tag_not_required') ?></div>
</div>
<h4><?= lang('tag_descrypt') ?></h4>
<div class="field">
<textarea name="descr" rows="4" cols="20" id="descr"><?= $descrbb ?></textarea>
</div>
<h4><?= lang('acces_permission') ?></h4>
<div class="field">
<?= lang('user_group', 'usergroup'); ?>
<?= form_dropdown('usergroup', $usergroup, $permission, 'id="usergroup"') ?>
</div>
<div class="right field">
<?= form_hidden('id', $id) ?>
<?= form_hidden('oldtag', $oldtag) ?>
<?= form_hidden('oldtitle', $oldtitle) ?>
<?= $this->gears->submit('create') ?>
</div>
</form>
<script type="text/javascript">
SMarkUp.bind(
'descr', //textarea id
'bbcode', //makup configuration name
120 //height of textarea
);
</script>
</div>
|
Потому что используя
Цитата:
Используйте
$(sret).filter('h2');
|
Кстати,
function(sr)
{
data = $(sr);
$('#dh2').empty();
$('#ajaxcontent').empty();
$('#dlgfooter').empty();
$(data).filter('h2').appendTo('#dh2');
$(data).filter('.sitefooter').appendTo('#dlgfooter');
$('#ajaxload').stop().fadeOut(500);
$(data).appendTo('#ajaxcontent');
$('#ajaxcontent').stop().fadeIn(500);}})}
тоже не работает. |
| Часовой пояс GMT +3, время: 11:49. |