Changing the model values locally without effecting the original model in SAPUI5

[former_member591631]

I am saving data in a model. Data has been fetched from a service call. I am setting that data on different dropdowns in the view. I am changing that data locally on a few checks and conditions but my values in the original data are also getting changed. How to stop that. I need my original data not to be effected.

[FiratAsan]

Hello,

i have tried;

1. JSON.parse and JSON.stringify method

2. Assigning values with For loops

3. Array.slice() method

4. spread operator (clonedArray = [...orginalArray]) method

5. Array.concat() method

But they are not worked. But i have done it with function:

//Cloning arrays:
            function deepCopyArray(arr) {
                if (Array.isArray(arr)) {
                    var copy = [];
                    for (let z = 0; z < arr.length; z++) {
                        copy[z] = deepCopyArray(arr[z])
                    }
                    return copy;
                } else if (typeof arr === 'object' && arr !== null) {
                    var copy = {};
                    for (var key in arr) {
                        if (arr.hasOwnProperty(key)) {
                            copy[key] = deepCopyArray(arr[key]);
                        }
                    }
                    return copy;
                } else {
                    return arr;
                }
            }

            if (editedInsList.length == 0) {
                editedInsList = deepCopyArray(defaultInsList);
                editedInsList2 = deepCopyArray(defaultInsList);
            }

And its done :))

[maheshpalavalli]

HI Swapnil Garg

Your code will be helpful!!

The issue might be because in javascript, the objects & arrays are pass by reference.

https://stackoverflow.com/questions/13104494/does-javascript-pass-by-reference

So to rectify your issue, you need to to the below:

//For Objects
var mCopiedObject = jquery.extend(true, {}, originalObject);


// For Arrays
var mCopiedArray = jquery.extend(true, [], originalArray);


// Now you can manipulate the copied object and arrays which will not affect the original object & array

BR,

Mahesh

[former_member591631]

I am copying the data fetched in an array and keeping the data in a model also. I want to keep my model unchanged and do the data manipulation using only the array. But it is not happening. Below are some snippets of my code :

Controller.js :

	_handleRouteMatched: function (evt) {
success: function (data) {
		that.mCopiedArray = $.extend(true,[], data.value);
		that.addmodel.setData(data);
				}
},


	onSubmit: function (evt) {
	if (Date.parse(fromDate) === Date.parse(currentDate)) {
				
				var tempVal = that.mCopiedArray;
				tempVal = formatter.mealContsraints(tempVal, currentDate, fromDate, currentTime, "null");
				that.addmodel.setProperty("/value", tempVal);
			} else {
				that.addmodel.setProperty("/value", that.addmodel.getProperty("/value"));
			}

}

[maheshpalavalli]

Hi Swapnil Garg

What is the value in data.value..? (I hope it is an array).

There is a small mistake from my side.. You need to use pass true to jQuery.extend() for deep copy.. Updated my original answer.

BR,

Mahesh

[former_member591631]

Hi Mahesh,

Yes data.value is an array. I updated my code as you said in the above comment but it is still not working.

[maheshpalavalli]

Hi Swapnil Garg, For sure "that.mCopiedArray" will have the copied array. I used that many times.. Check if you are updating that data at anyother place and can you tell me at which place the data is getting updated in that.mCopiedArray

BR,

Mahesh