Change columns of a table in WordPress - html

Question

I have a large table in WordPress, I need to change the order of the columns, but I have to do it manually every time, when I need. Is there any plugin out there, in which all table loads up and I drag and drop the whole column from there as my choice?
The website is here

Answer 1

Based on your question, i can give you a demo to show you how to move forward with your requirements.
Please check this UPDATED FIDDLE. As you requested we are using Dragtable js.
Once sorting is completed we checks each row of the table finds each column of the respective row and create a json tree structure.
Html
<table id="sort_table">
<thead>
<tr>
<th></th>
<th class="draggable">Col1</th>
<th class="draggable">Col2</th>
<th class="draggable">Col3</th>
<th class="draggable">Col4</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row1</td>
<td>Data11</td>
<td>Data12</td>
<td>Data13</td>
<td>Data14</td>
</tr>
<tr>
<td>Row2</td>
<td>Data21</td>
<td>Data22</td>
<td>Data23</td>
<td>Data24</td>
</tr>
<tr>
<td>Row3</td>
<td>Data31</td>
<td>Data32</td>
<td>Data33</td>
<td>Data34</td>
</tr>
<tr>
<td>Row4</td>
<td>Data41</td>
<td>Data42</td>
<td>Data43</td>
<td>Data44</td>
</tr>
</tbody>
</table>
JS (UPDATED)
$(document).ready(function() {
$('#sort_table').dragtable({
dragaccept: '.draggable',
beforeStop: function() {
var tree = {};
var rows = [];
$('#sort_table tr').each(function() {
var col_count = 0;
var cols = [];
$(this).children().each(function() {
cols[col_count] = $(this).html();
col_count++;
});
rows.push(cols);
});
tree.data = rows;
var tree_json = JSON.stringify(tree); // use the variable to save to DB
console.log(tree_json);
}
});
});
You can save the variable tree_json to database (Call ajax to php and save to DB)
On each page load you could take the value from database to a variable and using json_decode to make the string a json object
$table_structure = ; // Code to take from db
$table_structure = json_decode($table_structure);
You can copy and paste json from console to check if its valid using JSONLint