доступ к данным таблицы данных с помощью привязки кликов - PullRequest
1 голос
/ 23 февраля 2012

Я использую Jquery DataTables 1.7.6 с JQuery 1.8.6.Я пытаюсь настроить таблицу данных, в которой кнопка находится в одной строке, а затем зафиксировать нажатие этой кнопки, чтобы переместить строку в другую таблицу.У меня проблема с получением данных в DataTable для вызова функций добавления и удаления.

<script type="text/javascript">
    $(document).ready(function () {
        var eligibleCreatives = $('#EligibleCreativeTableId').dataTable({
            "bJQueryUI": true,
            "bStateSave": true,
            "bAutoWidth": false,
            "aoColumnDefs": [
                { "bSortable": false, "aTargets": [0] },
                { "bVisible": false, "aTargets": [3] },
            ],
            "aaSorting": [[1, "asc"]]
        });
        associatedCreatives = $('#AssociatedCreativeTableId').dataTable({
            "bJQueryUI": true,
            "bStateSave": true,
            "bAutoWidth": false,
            "aoColumnDefs": [
                { "bSortable": false, "aTargets": [0] },
                { "bVisible": false, "aTargets": [3] },
            ],
            "aaSorting": [[1, "asc"]]
        });

        eligibleCreatives.$('tr').click(function () {
            var data = .fnGetData( this );
            // this tells me that eligibleCreatives has no method $

        });


        $('#disassociate-creative').click(function () {
        //I can't get at the actual row node here.
        var data = associatedCreatives.fnGetData($(this).closest('tr')[0]);
        eligibleCreatives.fnAddData(data);
        associatedCreatives.fnDeleteRow(this); 
        return false;
        });
        $('#associate-creative').click(function () {
        var data = associatedCreatives.fnGetData($(this).closest('tr')[0]);
        associatedCreatives.fnAddData(data);
        eligibleCreatives.fnDeleteRow(this);
        return false;
        });

    });
    function fnClickAssociate() {
        $('#AssociatedCreativeTableId').dataTable().fnDeleteRow();
        $('#AssociatedCreativeTableId').dataTable().fnAddData([]);
    }
</script>

1 Ответ

1 голос
/ 16 марта 2012

Я думаю, проблема в том, что fnGetData возвращает объект данных содержимого определенной строки, а не сам узел. Но для fnAddData и fnDeleteRow требуется узел TR, а не объект данных. Два способа решить эту проблему:

Опция 1 : Если вы уверены, что $(this).closest('tr')[0] возвращает весь элемент TR для нужной строки, измените первую строку каждой из ваших click функций на:

var data = $(this).closest('tr')[0];

Это должно обеспечить функции в следующих двух строках соответствующего узла TR для выполнения действия.

Вариант 2 : Если вы не уверены, что $(this).closest('tr')[0] возвращает весь элемент TR (вы можете проверить это с помощью console.log(), чтобы узнать, возвращается ли соответствующий контент), тогда Я хотел бы рассмотреть возможность использования Datatable.net fnGetPosition для элемента TD, в котором находится кнопка. Я обнаружил, что он гораздо более гибкий, и он всегда будет возвращать элемент, который можно использовать с fnAddData и fnDeleteRow.

Удачи!

...