Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Ajax. проверка ответа перед интеграцией в страницу (https://javascript.ru/forum/jquery/57354-ajax-proverka-otveta-pered-integraciejj-v-stranicu.html)

Dtri 31.07.2015 02:43

Ajax. проверка ответа перед интеграцией в страницу
 
Здравствуйте,

С сервера приходит определённый дом. Например:
<div class="main-wrapper">
            <div>
                div1 вложенность 1
                <div>
                    div1 вложенность 2
                </div>
            </div>
            <div>
                div2 вложенность 1
                <div>
                    div1 вложенность 2
                    <div>
                        div1 вложенность 3
                    </div>
                    <div>
                        div2 вложенность 3
                    </div>
                </div>
            </div>
            <div>
                div3 вложенность 1
            </div>
            <div>
                div4 вложенность 1
            </div>
            <div>
                div5 вложенность 1
            </div>
            <div>
                div6 вложенность 1
            </div>
            <div>
                div7 вложенность 1
            </div>
        </div>

этот ответ аджаксом подгружается в такую страницу:
<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
        <title></title>
    </head>
    <body>

        <div class="main-wrapper">
            <div></div>
        </div>
        <div class="second-wrapper">
            <div></div>
        </div>
        <div class="third-wrapper">
            <div></div>
        </div>
    </body>
</html>


как видно в странице назначения уже есть div с классом main-wrapper

задача:
1. проанализировать ответ от сервера (найти div-ы с одинаковыми классами в ответе и странице назначения {в данном примере это .main-wrapper}).
2. удалить из файла назначения блоки с классами, которые встречаются в ответе от сервера
(в данном примере это div с классом .main-wrapper)
3. вставить ответ сервера в отредактированную страницу назначения {main-wrapper заранее удалён}


Проверку на одинаковые классы нужно проводить только в дочерних элементах body (первой вложенности).
колличество таких элементов неограничено.

Желательно не использовать циклы.

laimas 31.07.2015 03:46

Это игра такая? Зачем же отдавать клиенту то, что придется удалять?

Dtri 31.07.2015 15:53

Цитата:

Сообщение от laimas (Сообщение 382215)
Это игра такая? Зачем же отдавать клиенту то, что придется удалять?

Это не игра, а вполне рутиная задача. в ответе от сервера приходит определённый контент в определённом диве (wrapper-е) но с другим содержимым, отличным от того что хранится в странице назначения, хоть врапппер и одного класа но содержимое этих блоков разное, чтобы избежать наслоения, предыдущий вариант, нужно удалять

laimas 31.07.2015 16:06

А зачем? Можете пояснить зачем сервер отдает клиенту данные, которые ему не нужны?

Dtri 31.07.2015 16:27

Цитата:

Сообщение от laimas (Сообщение 382284)
А зачем? Можете пояснить зачем сервер отдает клиенту данные, которые ему не нужны?

они нужны.

есть изначально div с классом main-wrapper. внутри него какая-то информация.

когда приходит ответ от сервера, в ответе может содержаться такойже див но с другой информацией внутри.

задача втасить новую информацию в страницу назначения так чтобы предыдущая удалилась. чтобы не получалось что после append будет 2 одинаковых блока main-wrapper. "в конце должен остаться только один", тот что пришёл от сервера. а устаревший должен затереться
:)

laimas 31.07.2015 16:39

Значит надо не искать и удалять, а заменять содержание новым.

Dtri 31.07.2015 16:52

Цитата:

Сообщение от laimas (Сообщение 382288)
Значит надо не искать и удалять, а заменять содержание новым.

отсюда вопрос, как?

вот страница.
<div class="class-1">

</div>
<div class="class-2">

</div>
<div class="class-3">

</div>
<div class="class-4">

</div>



ответ может приходить разный. иногда вот такой:

<div class="sovsem-drugoi-class-1">

</div>
<div class="sovsem-drugoi-class-2">

</div>
<div class="sovsem-drugoi-class-3">

</div>
<div class="class-4">

</div>


а может и такой:

<div class="class-1">

</div>
<div class="class-2">

</div>
<div class="class-3">

</div>
<div class="class-4">

</div>

Dtri 31.07.2015 16:53

в первом случае одинаковый только четвёртый блок, во втором случае все блоки одинаковые.


И главная страница, не всегда одинаковая, она может состоять из 4х, 5 ..... и так далее блоков

Dtri 31.07.2015 16:54

$.ajax({
            url: href,
            data: JSON.stringify({"name":"Vasia"}),
            type: target,
            contentType: 'application/json',

            success: function (requestData, status, xhr) {
                $(requestData).children('div').each(function(){
                    id = $(this).uniqueId(); // смотрю все блоки первой вложенности в ответе от сервера.
                    $(id).remove(); // удаляю у родителя элементы с такими же id


                });
                $('body').append(requestData); // помещаю ответ сервера в страницу назначения

            }
        });


пытаюсь сделать вот так. но что-то не работает

Dtri 31.07.2015 17:05

$(requestData).children('div').each(function(){
                    id = $(this).attr('id'); // беру строкой значение id
                    $('"#'+id+'"').remove(); // пытаюсь запихнуть в  селектор


                });


вот так тоже не выходит

laimas 31.07.2015 17:53

Странно, классы как раз и существуют для того, чтобы можно было определить для целой коллекции элементов единые стили, у вас же они плодятся новыми.

Если честно, то ни черта не понятно, с чего вдруг нечто нужно удалять и по какому принципу. Почему по имени класса, это что означает, что содержание этого элемента повторяется, и, если да, то почему?

Что это такое, словами можно описать то, что делаете, без кода?

join 31.07.2015 17:58

Цитата:

Сообщение от Dtri (Сообщение 382294)
$(requestData).children('div').each(function(){
                    id = $(this).attr('id'); // беру строкой значение id
                    $('"#'+id+'"').remove(); // пытаюсь запихнуть в  селектор


                });


вот так тоже не выходит

правильно так.

Кстати, контент может приходить по АПИ с другого сервера, доступа к которому нет. Классы могут совпадать да и вообще Laimas любитель поиграть в 'почемучку' :)

Dtri 31.07.2015 18:53

Цитата:

Сообщение от join (Сообщение 382298)
правильно так.

Кстати, контент может приходить по АПИ с другого сервера, доступа к которому нет. Классы могут совпадать да и вообще Laimas любитель поиграть в 'почемучку' :)

большое спасибо, прочитать не успел сам также сделал.


вобщем задача решена.


var id = '';
        $.ajax({
            url: href,
            data: JSON.stringify({"name":"Vasia"}),
            type: target,
            contentType: 'application/json',

            success: function (requestData, status, xhr) {
                $(requestData).children('div').each(function(){
                    id = '#'+$(this).attr('id');
                    $(id).remove();
                    $('body').append($(this));

                });


            }
        });

laimas 31.07.2015 19:07

Цитата:

Сообщение от join
Laimas любитель поиграть в 'почемучку'

А вам понятно нахрена сервер отдает то, что нужно выбрасывать?


Часовой пояс GMT +3, время: 14:58.