How to drag rows in both Horizontal and Vertical Direction from GridView using jQuery in ASP.Net

I think I've found the answer, was really simple and I feel quite dumb! Just requires a single to change to the javascript.

Original:

<script type="text/javascript">
    $(function () {
        $(".drag_drop_grid").sortable({
            items: 'tr:not(tr:first-child)',
            cursor: 'crosshair',
            connectWith: '.drag_drop_grid',
            axis: 'y',
            dropOnEmpty: true,
            receive: function (e, ui) {
                $(this).find("tbody").append(ui.item);
            }
        });
        $("[id*=gvDest] tr:not(tr:first-child)").remove();
    });
</script>

Fixed:

<script type="text/javascript">
    $(function () {
        $(".drag_drop_grid").sortable({
            items: 'tr:not(tr:first-child)',
            cursor: 'crosshair',
            connectWith: '.drag_drop_grid',
            axis: 'x, y',
            dropOnEmpty: true,
            receive: function (e, ui) {
                $(this).find("tbody").append(ui.item);
            }
        });
        $("[id*=gvDest] tr:not(tr:first-child)").remove();
    });
</script>

All that's needed to change the axis from y to x,y