# NG component pushToServer question

**URL:** <https://forum.servoy.com/t/ng-component-pushtoserver-question/20333>\
**Category:** Questions\
**Created:** [October 1, 2020, 8:14pm UTC](https://forum.servoy.com/t/ng-component-pushtoserver-question/20333 "2020-10-01T20:14:04Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![steve1376656734](https://yyz2.discourse-cdn.com/flex010/user_avatar/forum.servoy.com/steve1376656734/32/4613_2.png) [@steve1376656734](https://forum.servoy.com/u/steve1376656734)\
**Post date:** [October 1, 2020, 8:14pm UTC](https://forum.servoy.com/t/ng-component-pushtoserver-question/20333/1 "2020-10-01T20:14:04Z")

</div>

Hi,

I am trying to write an NG component and have a question regarding pushing values to the server.

In my .spec file I have the following property definition:

```auto
{
	"name": "ewscomponents-testcomponent",
	"displayName": "EWS Test",
	"version": 1,
	"definition": "ewscomponents/testcomponent/testcomponent.js",
	"libraries": [],

	"model": 
	{
		"settings": 
		{
			"type": "settingsObject",
			"pushToServer": "shallow",
			"tags": {
				"doc": "The settings for this element"
			},
			"default": { }
		},

		"visible": "visible"
	},

	"types": 
	{
		"settingsObject": 
		{
			"options": 
			{
				"type": "optionsObject",
				"tags": {
					"doc": "The options for the component"
				},
				"default": { }
				
			}
		},

		"optionsObject": 
		{
			"sizes": 
			{
				"type": "float[]",
				"tags": {
					"doc": "The relative size of each of the options. Specified as an array of numbers"
				},
			},
			"default": { }
		}
	}
}

```

In the .js file I have a watch on the property using:

```auto
// Watch the sizes
$scope.$watch('model.settings.options.sizes', function(newValue, oldValue) {
	if ($scope.optionsContainer) $scope.optionsContainer.setSizes(newValue);
}, true);

```

Also in the .js file I have a callback from my client component that is triggered when they end a drag on one of the options:

```auto
onDragEnd: function() {
	if ($scope.split) {
		$scope.model.settings.options.sizes.length = 0;
		$scope.$apply();
		$scope.optionsContainer.getSizes().forEach(function(element, index) {
			$scope.model.settings.options.sizes.push(element);
		});
		$scope.$apply();
	}
}

```

My issue is that the array of sizes can be changed on the client and I want these changes pushed back to the server. The problem I am getting is that this all works fine as log as the sizes array is empty when the component is initialised but if it already contains values then when the client tries to update the array I get errors on the server:

```auto
ERROR org.sablo.specification.property.CustomJSONPropertyType - Cannot correctly parse custom array property updates/values from browser. Update JSON: {"vEr":2,"u":[{"i":"0"}]} org.json.JSONException: JSONObject["v"] not found.

```

Can anyone see what I am doing wrong?

Thanks  
Steve

---

<div class="post-metadata">

**Author:** ![sbutler](https://yyz2.discourse-cdn.com/flex010/user_avatar/forum.servoy.com/sbutler/32/4393_2.png) [@sbutler](https://forum.servoy.com/u/sbutler)\
**Post date:** [October 5, 2020, 3:51pm UTC](https://forum.servoy.com/t/ng-component-pushtoserver-question/20333/2 "2020-10-05T15:51:21Z")

</div>

just a quick guess from glancing at it. Wondering if the “default” of optionsObject needs moved in inside sizes? and maybe changed to   
like

```auto
      "optionsObject":
      {
         "sizes":
         {
            "type": "float[]",
            "tags": {
               "doc": "The relative size of each of the options. Specified as an array of numbers"
            },
            "default": []
         }
      }

```