I have a question connected to updating DB with Jquery sortable.

My JS code to update sort order and send it to php file via ajax is:

Code:
$("#menu-pages").sortable({
update: function(event, ui) {
$.post("ajax.php", { type: "orderPages", pages: $('#menu-pages').sortable('serialize') } );
}
});
but it updates sort results in DB on each change.

I'd rather to could use it only after button click, so I'd like to this part of code looks more like this:

Code:
$("#changeSortOrder").click(function(event) {
event.preventDefault();
$("#result").html('');
var values = $('#menu-pages').sortable('serialize');

$.ajax({
	url: "ajax.php",
	type: "post",
	data: values,
	success: function(){
		alert("success");
			$("#result").html('submitted successfully');
		},
	error:function(){
		alert("failure");
		$("#result").html('there is error while submit');
		}   
	}); 
});
Somehow can't make it work.