Nano Hash - криптовалюты, майнинг, программирование

Пользовательский интерфейс Jquery разбивает все остальные таблицы на веб-сайте

Я использую скрипт jquery под названием datatables, он добавляет в ваши таблицы множество функций, таких как поиск, фильтрация и т. д., и позволяет вам скинировать таблицы с помощью пользовательского интерфейса jquery. Я пытаюсь воспроизвести следующий пример на своем веб-сайте, чтобы фильтровать столбцы. http://www.datatables.net/release-datatables/examples/api/multi_filter_select.html Проблема, с которой я столкнулся сейчас, заключается в том, что когда я использую следующий скрипт на своем веб-сайте, он удаляет пользовательский интерфейс jquery на всех других таблицах.

Например, в одной из других таблиц у меня есть этот набор на странице:

      $(document).ready( function() {

        $('#mailinglistmanager').dataTable( {

            "bJQueryUI": true,

            "bInfo": true,

            "bAutoWidth": true,

            "bFilter": false,

            "bLengthChange": true,

            "bPaginate": true,

            "bProcessing": true,

             "bSort": true,

              "sPaginationType": "full_numbers",

               "aaSorting": [[ 6, "desc" ]],

                "iDisplayLength": 100,

                "bLengthChange": false   

        } );

        });

     </script>

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

            (function($) {
    /*
     * Function: fnGetColumnData
     * Purpose:  Return an array of table values from a particular column.
     * Returns:  array string: 1d data array 
     * Inputs:   object:oSettings - dataTable settings object. This is always the last argument past to the function
     *           int:iColumn - the id of the column to extract the data from
     *           bool:bUnique - optional - if set to false duplicated values are not filtered out
     *           bool:bFiltered - optional - if set to false all the table data is used (not only the filtered)
     *           bool:bIgnoreEmpty - optional - if set to false empty values are not filtered from the result array
     * Author:   Benedikt Forchhammer <b.forchhammer /AT\ mind2.de>
     */
    $.fn.dataTableExt.oApi.fnGetColumnData = function ( oSettings, iColumn, bUnique, bFiltered, bIgnoreEmpty ) {
        // check that we have a column id
        if ( typeof iColumn == "undefined" ) return new Array();

        // by default we only wany unique data
        if ( typeof bUnique == "undefined" ) bUnique = true;

        // by default we do want to only look at filtered data
        if ( typeof bFiltered == "undefined" ) bFiltered = true;

        // by default we do not wany to include empty values
        if ( typeof bIgnoreEmpty == "undefined" ) bIgnoreEmpty = true;

        // list of rows which we're going to loop through
        var aiRows;

        // use only filtered rows
        if (bFiltered == true) aiRows = oSettings.aiDisplay; 
        // use all rows
        else aiRows = oSettings.aiDisplayMaster; // all row numbers

        // set up data array    
        var asResultData = new Array();

        for (var i=0,c=aiRows.length; i<c; i++) {
            iRow = aiRows[i];
            var aData = this.fnGetData(iRow);
            var sValue = aData[iColumn];

            // ignore empty values?
            if (bIgnoreEmpty == true && sValue.length == 0) continue;

            // ignore unique values?
            else if (bUnique == true && jQuery.inArray(sValue, asResultData) > -1) continue;

            // else push the value onto the result data array
            else asResultData.push(sValue);
        }

        return asResultData;
    }}(jQuery));


    function fnCreateSelect( aData )
    {
        var r='<select><option value=""></option>', i, iLen=aData.length;
        for ( i=0 ; i<iLen ; i++ )
        {
            r += '<option value="'+aData[i]+'">'+aData[i]+'</option>';
        }
        return r+'</select>';
    }


    $(document).ready(function() {
        /* Initialise the DataTable */
        var oTable = $('#dashboard').dataTable( {
           "bJQueryUI": true,

                    "bInfo": true,

                    "bAutoWidth": true,

                    "bFilter": true,

                    "bLengthChange": true,

                    "bPaginate": true,

                    "bProcessing": true,

                     "bSort": true,

                      "sPaginationType": "full_numbers",

                       "aaSorting": [[ 9, "desc" ]],

                        "iDisplayLength": 5,

                        "bLengthChange": false   
        } );

        /* Add a select menu for each TH element in the table footer */
        $("tfoot th").each( function ( i ) {
            this.innerHTML = fnCreateSelect( oTable.fnGetColumnData(i) );
            $('select', this).change( function () {
                oTable.fnFilter( $(this).val(), i );
            } );
        } );
    } );

Ответы:


1

Ваш селектор jQuery для fnCreateSelect выбирает th элементов в каждом tfoot для каждой таблицы. Поскольку очевидно, что все другие таблицы затронуты, попробуйте изменить $("tfoot th") на $("#dashboard tfoot th"), чтобы выбрать только tfoot для этой таблицы.

30.01.2012
  • Спасибо за помощь, думаю так и должно быть :-) 30.01.2012
  • Новые материалы

    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..

    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..

    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..

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

    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..

    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..