Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » Активные темы » Работа с базой на 50 тысяч строк

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки
Страницы: 1 2

Открыть новую тему     Написать ответ в эту тему

D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Привет!  
Есть 50 тысяч изображений — экслибрисов, готовящихся для раздачи на трекере, для удобства пользования по различным частям имен которых надо обеспечить поиск, поскольку в них будет содержаться до восьми категорий. То есть, чтобы после их скачивания желающими — пользователь мог проводить по ним поиск через файл из той же папки, полностью локально.  
 
Предполагается использование html-файла и js, возможности которых, судя по некоторым примерам, более чем приемлимы. Судя по всему, потребуется база со списком, из которой по запросу в html будут подгружаться соответствия поиску, в котором есть необходимость в нескольких поисковых строках, для поиска в определенных частях имён изображений, напр. —  
 
Автор изображения | Название | Страна | Год создания.  
 
Идеальным был бы следующий вариант — https://community.algolia.com/demo-infinite-scroll/ только он "демонстративный" и его нельзя сделать локальным. Может у кого-то есть на примете такие же настраиваемые варианты?
 
Подошел бы следующий пример на несколько мегабайт, с возможностью поиска по нескольким параметрам: http://dabblet.com/gist/1528281 (или http://search.archimeta.ru/) — если б только список в нём не размещался в самом файле, и если бы выводимые результаты из базы можно было ограничивать пагинацией.
 
Также был найден другой подходящий пример, типа сортируемых таблиц — скрипт "Filtering.zip" (https://yadi.sk/d/B1XZleWb3Ma6xU), фильтрующий данные из колонок, который базу на 50 тысяч строк в 6 колонок открывает и сортирует довольно быстро, поддерживает пагинацию, гибкий поиск и который можно использовать локально. Здесь онлайн-пример: https://js.devexpress.com/Demos/WidgetsGallery/Demo/DataGrid/Filtering/Knockout/Light/  
На сайте разработчиков существует множество его вариантов, только вот в этой версии нет возможности вставки изображений, которые без настройки выводятся как HTML-код, хотя в других версиях скрипта с того же сайта (например в этой: https://js.devexpress.com/Demos/WidgetsGallery/Demo/DataGrid/Column3RdPartyEngineTemplate/jQuery/Light/) изображения поддерживаются. Мне подсказывали, что надо отредактировать файл index.js из архива, приведя следующий код, чего сделать без знаний js у меня так и не вышло:
 

Код:
 
$(function(){ // 36519142397 1Q—d_
    $("#gridContainer").dxDataGrid({
        dataSource: employees,
        columns: [{
                dataField: "Picture",
                width: 100,
                allowFiltering: false,
                allowSorting: false,
                [B]cellTemplate: function (container, options) {
                    $("<div>", { "class": "img-container" })
                        .append($("<img>", { "src": options.value }))
                        .appendTo(container);
                }
            },
            ...
        ]
    });
     
});
 


Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 02:48 04-09-2017 | Исправлено: D1D1D1D, 15:46 15-06-2021
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
 чего сделать без знаний js у меня так и не вышло:

сложность то в чем?

Код:
        columns: [{
            dataField: "Pic",  
            width: 100,  
            allowFiltering: false,  
            allowSorting: false,  
            cellTemplate: function (container, options) {  
                    $("<div>", { "class": "img-container" })  
                        .append($("<img>", { "src": options.value }))  
                        .appendTo(container);  
                }  
        },
{
            dataField: "OrderNumber",
            width: 130,
            caption: "Invoice Number",
            headerFilter: {
                groupInterval: 10000
            }
        }, {
            dataField: "OrderDate",
            alignment: "right",
            dataType: "date",

 
в data.js в записи (в каждую) добавляете поле Pic:

Код:
var orders = [{
    "ID": 1,
   "Pic": "https://a.deviantart.net/avatars/m/e/mellowshark.gif",
    "OrderNumber": 35703,
    "OrderDate": "2014/04/10",
    "SaleAmount": 11800,
    "Terms": "15 Days",
    "CustomerStoreState": "California",
    "CustomerStoreCity": "Los Angeles",
    "Employee": "Harv Mudd"
}, {
    "ID": 4,

и все

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 07:33 04-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Спасибо!

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 20:46 04-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
По ходу дела возник вопрос по программистской части и заодно — по визуальной. Обсуждавшийся выше скрипт приобрел следующий вид и в отношении функционала хочется спросить, есть ли возможность разбивать содержимое колонки "Ключевые слова" на составляющие и сортировать по отдельности? То есть, чтобы слова Bird|Literature|Sun со скриншота, фильтр разбивал в местах символа "|", и группировал с подобными словами — и при этом чтобы при поиске файл с ключевыми словами "Bird|Literature|Sun" выводился по каждому из этих слов? —
 

 
А по визуальной части интересует, дано ли переместить видимое на скрине справа вверху поисковое окно в боковую, вторую сверху, ячейку слева и полностью убрать отступы для изображений? А то там они взаимосвязаны — если убрать отступы у изображений, они убираются и для текста.

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 22:24 07-09-2017 | Исправлено: D1D1D1D, 22:28 07-09-2017
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
если убрать отступы у изображений, они убираются и для текста.

к примеру так

Код:
.img-container {
 margin: -6px;
}

 

Цитата:
"Bird|Literature|Sun" выводился по каждому из этих слов?

наверно же можно, только нужно разбираться в принципе работы скрипта

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 23:17 07-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Ясно, спасибо. А поиск перенести есть способ?

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 23:24 07-09-2017
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
А поиск перенести есть способ?

родного видимо нет, нужно кромсать/дополнять скрипт.
 
списком можно манипулировать вот так, к примеру (не уберет дубли)

Код:
        headerFilter: {
            dataSource: function(data) {
                data.dataSource.postProcess = function(results) {
                    var newResults = [];
                    $.map(results, function(el) {
                       var tmp = el.value.split('|');
                       for (var i = 0; i < tmp.length; i++)
                          newResults.push({
                             text: tmp[i],
                             value: tmp[i]
                          });
                    });
                    return newResults;
                };
            }
        }

но вот фактическую фильтрацию тоже придется переделывать
 
Добавлено:
Можно вот так

Код:
      {
        width: '10%',
        dataField: 'word',
        selectedFilterOperation: 'contains',
        caption: 'Ключевые слова',
        headerFilter: {
            dataSource: function(data) {
                data.dataSource.postProcess = function(results) {
                    var newResults = [], used = [];
                    $.map(results, function(el) {
                       var tmp = el.value.split('|');
                       for (var i = 0; i < tmp.length; i++)
                          if (used.indexOf(tmp[i]) === -1) {
                            used.push(tmp[i]);
                            newResults.push({
                               text: tmp[i],
                               value: el.value
                            });
                          }
                    });
                    return newResults;
                };
            }
        }
      },

тогда строка поиска находит (если вручную набивать), и чекбоксы не повторяются, но фильтрация по чекбоксам через contains не срабатывает
 
ps: исправил, теперь работает
 
правда при повторном нажатии на фильтр отмечены все опции, надо дальше копать - самостоятельно уж )

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 23:34 07-09-2017 | Исправлено: Mavrikii, 00:19 08-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Спасибо, это как раз подходит, потому что, действительно, искать можно через общий поиск, а через этот фильтр получать представление о доступных ключевых словах. И в таком случае, получится ли заблокировать чекбоксы или кнопку окей именно для этого окна?
 
Добавлено:
Mavrikii
 
Благодарю, отлично вышло!

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 00:25 08-09-2017
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

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

если такими вещами занимаетесь, у вас нет нормального вебмастера ?)  
это уже сложнее, так как всплывающее окошко не привязано напрямую именно к этой колонке (хоть и ссылается, то через css это не дает возможности написать для него стиль в этом случае)
по умолчанию такой возможности нет, как и не видно события выбрасываемого в момент отображения окошка фильтрации
https://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxDataGrid/Configuration/headerFilter/

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 00:42 08-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
Нормального вебмастера нет, потому что я сам себе вебмастер)) Кстати по предыдущему фрагменту кода оказалось, что при выборе одного ключевого слова из группы, происходит выбор сразу всех слов и поэтому отдельные слова в выборку не попадают. То есть, если выбрать слово Sun по чекбоксу, результат выдаст только Sun из групп, а множество отдельных Sun не покажет. В связи с этим у меня вопрос, может получится по клику на значок фильтра показывать уже вписанный в код  готовый список слов, по выбору одного из которых вставлять его в окно поиска?

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 01:06 08-09-2017
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
а множество отдельных Sun не покажет.


Цитата:
value: el.value

из за этого. по этой же причине, если поменять порядок, ключевых в строке, тоже, скорее всего, не будет находить. оно ищет только по полному совпадению, а не для contains (который срабатывает только для поиска)
там не хватает методов для написания своей фильтрации (а может и не вижу их)
 
тут наброски есть какие то - https://www.devexpress.com/Support/Center/Question/Details/T320506/dxdatagrid-how-to-create-a-custom-header-filter-popup

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 01:24 08-09-2017 | Исправлено: Mavrikii, 01:28 08-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
По дизайну вот что получилось — общий поиск перенес вниз и зафиксировал, также зафиксирована заголовочная часть таблицы:
 

 
И вот интересует в отношении выделенного — можно ли перечеркнутую часть (две ячейки) сделать прозрачной? Или, присвоив стиль именно для этих ячеек, принять какие-то другие меры? Или может слой изображения по вертикали пустить поверх — у меня не получилось.
 
Также хотелось бы исправить поведение, когда при переходе на другую страницу с середины страницы — на следующей тоже оказываешься в середине, а не в верху. Может есть способ при нажатии на ссылки пагинации — заодно отправлять в #onTop по якорю?

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 02:12 09-09-2017
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Привет. Удалось назначить определенный стиль этим двум ячейкам (см. файл «styles.css» из архива), который выделяет их красным —
 
 

 
 
Дано ли их как-то скрыть?
 

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 00:00 14-10-2020 | Исправлено: D1D1D1D, 00:01 14-10-2020
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
Дано ли их как-то скрыть?

display: none

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 00:05 14-10-2020
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
 
Но тогда происходит смещение всех других колонок влево. А видимо требуется именно чтобы они существовали, но были невидимы. Может, есть способ применить к ним z-index`ы или opacity? Я пробовал - не пошло

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 00:11 14-10-2020 | Исправлено: D1D1D1D, 00:13 14-10-2020
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
чтобы они существовали, но были невидимы

visibility: hidden
или  
opacity: 0

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 00:18 14-10-2020
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Увы, тогда просто скрывается верхний красный слой и текст, а самый нижний основной бэкграунд остается на месте
 
Добавлено:
Может именно z-index надо применять, чтобы картинки поверху этих ячеек шли?

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 00:22 14-10-2020
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
Увы, тогда просто скрывается верхний красный слой и текст, а самый нижний основной бэкграунд остается на месте

внятнее выражайте свои пожелания, ибо

Цитата:
Дано ли их как-то скрыть?

означает именно "не отображать".
 
в архиве картинки нет, как мне понять где она там реализована?
ну и если красное в одной ячейке таблицы, а картинка в другой - не совсем понятно какое перекрытие ожидается

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 00:38 14-10-2020 | Исправлено: Mavrikii, 00:39 14-10-2020
D1D1D1D

Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Mavrikii
 
Да, имелось в виду полное сокрытие ячейки, чтобы она скрывалась не просто на уровне текста, а чтобы ее вообще видно не было.
 
Насчёт картинки, извиняюсь - если положить картинку в архив  - она все равно не отображалась, там надо указывать к ней полный путь в базе, в файле «data.js». Просьба указать в нем полный путь на какую-нибудь картинку с ПК
 
Добавлено:
Mavrikii

Цитата:
ну и если красное в одной ячейке таблицы, а картинка в другой - не совсем понятно какое перекрытие ожидается

Перекрытие красного (вместе со всеми ячейками) - картинкой

Всего записей: 1362 | Зарегистр. 05-04-2010 | Отправлено: 00:46 14-10-2020 | Исправлено: D1D1D1D, 00:50 14-10-2020
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
D1D1D1D

Цитата:
Перекрытие красного (вместе со всеми ячейками) - картинкой

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

Всего записей: 15040 | Зарегистр. 20-09-2014 | Отправлено: 00:51 14-10-2020
Открыть новую тему     Написать ответ в эту тему

Страницы: 1 2

Компьютерный форум Ru.Board » Интернет » Web-программирование » Активные темы » Работа с базой на 50 тысяч строк


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru