I'm using Bootstrap-Table in a project and I'd like to move rows up or down.

I have these action events :

window.actionEvents = {
'click .up': function (e, value, row, index) {
var thisrow = $(this).parents("tr:first"),
thisrow.prev().data('index', rowindex);
},
'click .down': function (e, value, row, index) {
var thisrow = $(this).parents("tr:first");
thisrow.insertAfter(thisrow.next());
},
}

It moves rows on screen but it doesn't work really well as row index haven't changed...

So I tried to change the row .data('index') but it doesn't work...

Has someone succeeded in moving row ?

I'm using Bootstrap-Table in a project and I'd like to move rows up or down.

I have these action events :

window.actionEvents = {
'click .up': function (e, value, row, index) {
var thisrow = $(this).parents("tr:first"),
thisrow.prev().data('index', rowindex);
},
'click .down': function (e, value, row, index) {
var thisrow = $(this).parents("tr:first");
thisrow.insertAfter(thisrow.next());
},
}

It moves rows on screen but it doesn't work really well as row index haven't changed...

So I tried to change the row .data('index') but it doesn't work...

Has someone succeeded in moving row ?

• javascript
• jquery
• twitter-bootstrap
• bootstrap-table

Share Improve this question Follow edited Apr 28, 2016 at 17:46 BENARD Patrick 31k1616 gold badges102102 silver badges108108 bronze badges asked May 6, 2015 at 7:22 AmandineAmandine 11511 silver badge55 bronze badges 2

• can you provide a fiddle??? – Guruprasad J Rao Commented May 6, 2015 at 7:33
• Here is the fiddle : jsfiddle/dfpo899p if you move rows by clicking + or - and press button you can see that data remains the same and it causes issues if i add a delete button by example ... – Amandine Commented May 6, 2015 at 7:56

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

Here is something :

Fiddle : https://jsfiddle/dfpo899p/1/

Js :

window.actionEvents = {
    'click .up': function (e, value, row, index) {
        var source = JSON.stringify($('#table').bootstrapTable('getData')[index]);
        var target = JSON.stringify($('#table').bootstrapTable('getData')[index - 1]);
        $('#table').bootstrapTable('updateRow', {'index':index - 1, 'row': JSON.parse(source)});
        $('#table').bootstrapTable('updateRow', {'index':index, 'row': JSON.parse(target)});
        },
    'click .down': function (e, value, row, index) {
        var source = JSON.stringify($('#table').bootstrapTable('getData')[index]);
        var target = JSON.stringify($('#table').bootstrapTable('getData')[index + 1]);
        $('#table').bootstrapTable('updateRow', {'index':index + 1, 'row': JSON.parse(source)});
        $('#table').bootstrapTable('updateRow', {'index':index, 'row': JSON.parse(target)});
        }
}