1

I would like to drag rows in a table build with jQuery jTable, on release update sort order with ajax call. Is that possible?

Can't find anything about draggable rows

Cerbrus
  • 70,800
  • 18
  • 132
  • 147
al404IT
  • 1,380
  • 3
  • 21
  • 54
  • http://stackoverflow.com/a/16863702/528370 – Thew Jan 24 '14 at 15:16
  • actually i prefer table, i thought to use query ui drag able but doesn't seem to work, i guess is because record was ad to table via ajax – al404IT Jan 24 '14 at 16:54

1 Answers1

1

i found a solution bind the query ui on recordsLoaded, call each time record are loaded

   $('#mytable').jtable({
        title: 'my title',
        paging: true,
        pageSize: 100,
        sorting: true,
        defaultSorting: 'order ASC',
        selecting: true,
        multiselect: true,
        selectingCheckboxes: true,
        columnSelectable: false,
        gotoPageArea: 'none',
        pageSizeChangeArea: false,
        actions: {
            listAction: '../ajax/myajax.php'
        },
        fields: {
            id: {
                key: true,
                create: false,
                edit: false,
                list: false
            },
            order: {
                title: 'order',
                create: false,
                edit: false,
                sorting: false
            }
        },
        recordsLoaded: function () {

            $(".jtable tbody").sortable({
                cursor: 'move',
                opacity: 0.9,
                axis: 'y',
                start: function (event, ui) {
                    if ($.browser.webkit) {
                        wscrolltop = $(window).scrollTop(); // bug fix
                    }
                },
                sort: function (event, ui) {
                    if ($.browser.webkit) {
                        ui.helper.css({ 'top': ui.position.top + wscrolltop + 'px' });  // bug fix
                    }
                },
                update: function(event, ui) {

                    // do jquery HERE on sort

                }

            }).disableSelection();

        }
    });
al404IT
  • 1,380
  • 3
  • 21
  • 54