Cannot blank out a field when using AngularJS and ng-resource

Question

For some reason when I update my form and try to blank out the field (in this example 'description'), the value that gets over to the server is the original value.

For example if the value of description is "description here" and then I blank out the value on the form, the client side shows undefined for the description field. After a $update (ng-resource) the value on the server side is the original value.

// when it gets to the server side, foo.description is filled in with the original value 
// after trying to blank it out
foo.$update(function() {
                $location.path('foo/' + $scope.foo._id);
            }, function(errorResponse) {
                $scope.error = errorResponse.data.message;
            });

Here is the plunkr of the client side.

Answer 1

"Undefined" coming is because of the "required" field present in your input field

    <input type="text" data-ng-model="foo.description" id="description" 
    class="form-control" placeholder="Description" required>

If you remove the "required" field, $scope.foo.description will have blank value instead of "undefined".

    <input type="text" data-ng-model="foo.description" id="description" 
    class="form-control" placeholder="Description">

Could you please try removing the "required" and see whether your issue is solved or not.