kendo inputs: Updating global variable on change()

[Alessandro]

Hello, sorry for the, maybe, dumb question, but I have a problem I can't solve.

I'm trying to update a DataSource transport data related on the change event of another input, here is the code:

                        var dp = new Date();
			var innerValue = 0;				
	function initPagamento(isNew) {

		dp = new Date();
		innerValue = 0;
		
		let ds = new kendo.data.DataSource({
				transport: {
					read: {
					url: "myURL",
					method: "post",
					data: {
					  data_movimento: dp.toLocaleDateString("it-IT"),
					  macro_categoria: innerValue
					},
					dataType: "json"
					}
				}
		});
		
		
		let datapagamento = $("#datapagamento").kendoDatePicker({
            format: "dd/MM/yyyy",
			change: function(x){
				$(".k-svg-i-save").parent("button").removeClass("k-disabled");
				dp = this.value();
				
				macro_categoria.dataSource.read();
				macro_categoria.trigger("change");
				
			}			
        }).data("kendoDatePicker");	
		//setInterval(function(){console.log(dp)}, 1000);
		
		let categoria =	$("#categoria").kendoDropDownList({
                filter: "contains",
				autoBind: true,
                optionLabel: "Seleziona una Categoria...",
 				dataTextField: "nome",
          		dataValueField: "id",
				dataSource: null,
			 change: function(x){
				 $(".k-svg-i-save").parent("button").removeClass("k-disabled");
			 }
		 }).data("kendoDropDownList");

		let macro_categoria = $("#macro_categoria").kendoDropDownList({
							filter: "contains",
							autoBind: true,
							optionLabel: "Seleziona una Macro Categoria...",
							dataTextField: "nome",
							dataValueField: "id",
			dataSource: {
				transport: {
					read: {
					url: "anotherUrl",
					method: "post",
					data: {
					  entrata: "0",
					  data: dp,
					},
					dataType: "json"
					}
				}
			},
			change: function(x) {

				$(".k-svg-i-save").parent("button").removeClass("k-disabled");

				innerValue = this.value();
				if(!isNullOrEmpty(innerValue) && (innerValue > 0 && innerValue != "0")) {
					categoria.dataSource = ds
					ds.read();
				} else {
					categoria.dataSource = null
				}
			}
			}).data("kendoDropDownList");
}

the two variables I want to change are dp and innerValue, so that when I change the datepicker value, dp (the date variable) is updated to the selected date, then the datasource (ds) has to call the transport > read uri sending via post the new dp value. Same thing with innerValue (this is the value from a kendoDropDownList, but I think the problem is the same...

it seems that the problem is here:

[...]
change: function(x){
				$(".k-svg-i-save").parent("button").removeClass("k-disabled");
				dp = this.value();
				
				macro_categoria.dataSource.read();
				macro_categoria.trigger("change");
				
			}
[...]

where dp value is updated locally (maybe redeclared locally inside the change() event), but not in the entire scope, as I want.

Please help me! If you need further infos let me know.

Thank you.

P.S.: I think that if I destroy and redeclare the DataSource instead of changing dp and innerValue values, it shall work, but I am slightly sure that there must be a simpler way...