Datatables - statesavecallback и другие функции sactivate on click

---

Как я могу реализовать stateSaveCallback / "colReorder" / "buttons": ['colvis'], чтобы быть включенным, когда пользователь нажимает на кнопку?

В принципе, мне нужно, чтобы пользователь мог редактировать datatable только тогда, когда он нажимает кнопку edit, а изменения должны быть сохранены, когда он нажимает кнопку save... если пользователь не нажмет кнопку сохранить, то никакие изменения не будут сохранены, а если он не нажмет кнопку изменить, то не сможет внести никаких изменений... есть идеи, как это сделать?

В настоящее время у меня есть приведенный ниже код для моего dataTable.

Что я уже пробовал:

 <pre lang="Javascript">$('#resultsTable').DataTable({
    			"stateSave": true,
    
    			// "serverSide": true,
    			//rows per page
    			"lengthMenu": [
    				[25, 50, 100, 150, 200, 250, -1],
    				[25, 50, 100, 150, 200, 250, "All"]
    			],
    			"dom": '<"top"Bfi>rt<"bottom"lp><"clear">', //show entries on bottom
    			//Scrolling table
    			"scrollY": 600, //Constrain the DataTable to the given height
    			"deferRender": true, //Elements will be created only when the are required
    			"scroller": true, //Enable vertical scrolling in DataTables.
    			"scrollX": true, //scroll horizontal 
    			"colReorder": true, // column reordering
    			"buttons": ['colvis'], //enable column visibility button
    			//Grouping table 
    			"columnDefs": [{ "visible": false, "targets": 0 }], //mades target column hidden //if commented ---> Uncaught TypeError: Cannot read property 'style' of undefined 
    			"order": [
    				[0, 'asc']
    			], //sorting based on column
    			
    			'stateSaveParams.dt': function(e, settings, data) {
    				data.search.search = "";
    				// table.columns.visible();
    			},
    			//SaveState
    			'stateSaveCallback': function(settings, data) {
    				$.ajax({
    					'url': 'saveDtableState.php',
    					'data': { name: 'resultsTable', 'state': data },
    					'dataType': 'json',
    					'method': 'POST',
    					"success": function() {},
    					error: function(xhr, ajaxOptions, thrownError) {
    						console.log(thrownError);
    					}
    				});
    			},
    			'stateLoadCallback': function(settings, callback) {
    				$.ajax({
    					'url': 'loadDtableState.php',
    					'data': { name: 'resultsTable' },
    					'dataType': 'json',
    					'type': "POST",
    					success: function(data) {
    						callback(data);
    						console.log('test: ' + data);
    
    					},
    					error: function(xhr, ajaxOptions, thrownError) {
    						console.log(thrownError);
    					}
    				});
    			}
    
    		})

will it work if I use this?

    $('#saveEdit').on("click", function(){
    		table.state.save();
    	});

or will it keep saving the state of the table every time I make a change? (I don't want that). and how to implement the other things? ***any tips? ***

---