переупорядочение изотопов после поиска не работает

Я интегрировал плагин поиска jquery для поиска по изотопным элементам, плагин использует регулярное выражение для сортировки контента в режиме реального времени на основе входных данных поиска.

Элементы изотопов обновляются автоматически (я использую плагин wordpress, который извлекает данные из социальных сетей)

Мой вопрос: как я могу изменить порядок элементов после выполнения поиска?

Л.Э: Я РЕШИЛ ЭТО, ИСПОЛЬЗУЯ ДРУГОЙ ПЛАГИН ДЛЯ ПОИСКА: Вот код:

               $(document).ready(function () {
            $("#id_search").quicksearch(".dcsns-content .isotope-item", {
                noResults: '#noresults',
                loader: 'span.loading',

                'show': function () {
    $(this).addClass('quicksearch-visible');
},
'hide': function () {
    $(this).removeClass('quicksearch-visible');
},
'onAfter': function () {
   $('.dcsns-content .stream').isotope({ filter: '.quicksearch-visible' });
}
            });
        });

person agis    schedule 17.05.2013    source источник
comment
вы используете jQuery(window).load(function(){ почему бы не jQuery(document).ready ? Возможно, элементы, которые вы ищете, еще не присутствуют при загрузке страницы. Кроме того, я не вижу элементов .wall-outer или .stream в вашем html.   -  person TCHdvlp    schedule 17.05.2013
comment
извините, но это мне не помогает; Я спросил еще кое-что, поиск работает, элементы в порядке, что мне нужно, так это способ изменить порядок элементов после поиска, вам просто нужно проверить ссылку   -  person agis    schedule 17.05.2013
comment
мой плохой, я думал, что это проблема с ReferenceError. Wmell, документация на сайте изотопов говорит о параметре getSortData. Я полагаю, вы уже попробовали это.   -  person TCHdvlp    schedule 18.05.2013
comment
Я перешел на готовый документ, но все равно та же ошибка с каждым методом, который я пытаюсь: $container не определен.   -  person agis    schedule 20.05.2013


Ответы (2)


когда вы объявляете $container в .load, его увидит только функция .load

два решения, вы добавляете var $container = $(); в обычном js, поэтому .load и .ready получат к нему доступ

или вы объединяете все в функцию .ready:

$(function(){
    var $searchBox = $("#searchbox");
    var $searchFilter = $('.searchFilter');
    var $container = $('.wall-outer .stream');

    $searchBox.on("blur",function(){
        if(this.value === '')
                this.value='Keyword(s)';
    }).on("focus",function(){
        if(this.value === this.defaultValue)
                this.value = '';
        else    this.value = null;
    });

    $searchFilter.simpleContentSearch({
        'active' : 'searchBoxActive',
        'normal' : 'searchBoxNormal',
        'searchList' : 'dcwss-content ul li',        // this is important
        'searchItem' : 'div'                        // this is important
    });

    $(".search-btn").on("click", function(){
        $searchBox.val( $(this).data("search") );
        $searchFilter.keyup();
        $container.isotope('reLayout');
    });

    $(".search-reset").on("click", function(){
        $searchBox.val("");
        $searchFilter.keyup();
        $container.isotope('reLayout');
    });             

    $container.isotope('reLayout');
});
person r043v    schedule 26.05.2013
comment
Спасибо за ваш ответ, но я уже нашел решение для этого! - person agis; 26.05.2013

Мне удалось получить одноразовый пример, добавив следующее в конец вашего файла filtercontent.js:

    // Get isotope container
    $container = jQuery('.dc-wall .stream');

    // Clear out existing isotope class instance
    $container.data('isotope', null);

    // Start a new isotope instance on the container
    $container.isotope({ filter: ':visible', sortBy: 'postDate' });

Это работает только при первом нажатии на search 1, но показывает, что концепция перезапуска изотопа действительна. Я недостаточно понимаю, как работает ваша фильтрация, но я надеюсь, что это даст вам отправную точку.

Проблема заключается в том, что фильтр содержимого анимирует элементы в display: none, используя hide() или fade(), поэтому это работало только в том случае, если скрытие было мгновенным (поэтому я также изменил фильтр, чтобы использовать hide(0)), например.

    jQuery(this).parent('.' + settings.searchList).hide(0);
person Gone Coding    schedule 21.05.2013
comment
Я поместил это в скрипку, но это странно, потому что работает с просто Поиск 1, если я нажму Поиск 2, не работает должным образом. Что это может работать, так это сделать что-то вроде того, когда щелкают поиск 1, переупорядочивают элементы, а когда щелкают поиск 2, первое, что нужно сделать, это сбросить ввод поиска, а затем выполнить поиск и после этого снова изменить порядок элементов. На мой взгляд, это может быть решение, которое может работать. Что вы думаете? Это возможно ? - person agis; 21.05.2013
comment
@Alecs: я не могу правильно протестировать ваш сайт с помощью JSFiddle, поскольку он извлекает файлы JS с вашего сервера и перезаписывает тестовый JS. Модификация должна была войти в filtercontent.js, но здесь она также выполнялась только в Search 1. Глядя на плагин социальной стены, он почти не вызывает изотоп, за исключением добавления новых элементов. Вы пытались связаться с авторами социальных плагинов? - person Gone Coding; 21.05.2013
comment
Я добавил это, но не работает, вы можете посмотреть ссылка, я спросил разработчики плагина тоже, но они не дают никаких указаний, просто просят деньги за это. Я нашел аналогичный вопрос здесь и думаю применить ту же концепцию в моем коде, но я не знаю, как это сделать в моем коде, потому что используется другой поисковый плагин. - person agis; 22.05.2013