Databases
StackOverflow2013
Postsdbo
POHow do I omit properties from angularjs form submit?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I omit properties from angularjs form submit?
    text
    copied!<p>I have a view that calls a form model from my server that includes a drop down list.</p> <p>When I submit my form all of the states in my drop down list are submitted as well. Seems silly to send back those values when the state id is all that is needed. If a form has multiple drop down lists this problem is compounded. I also noticed that any property that is included in my from model is also submitted even if it is NOT included in my form. That doesn't seem right at all.</p> <p><strong>How do I omit certain properties that are not part of my form from being submitted?</strong></p> <p>My model looks like this:</p> <pre><code>{ "id":25, "name":"joe smith", "dummyProperty": "whatever", "stateId":5, "states":[ {"value":1, "label": "Alabama"}, {"value:2, "label": "Alaska"}, {etc...} ] } </code></pre> <p>My form looks like this:</p> <pre><code>&lt;form autocomplete="off" novalidate name="form"&gt; &lt;input type="hidden" ng-model="item.id" id="id" name="id" /&gt; &lt;div class="se-row"&gt; &lt;label&gt;Name&lt;/label&gt; &lt;input type="text" ng-model="item.name" id="name" name="name" /&gt; &lt;/div&gt; &lt;div class="se-row"&gt; &lt;label&gt;State&lt;/state&gt; &lt;select ng-model="item.stateId" id="stateId" name="stateId"&gt; &lt;option value="0"&gt;Select...&lt;/option&gt; &lt;option value="{{o.value}}" ng-repeat="o in item.states"&gt;{{o.label}}&lt;/option&gt; &lt;/select&gt; &lt;/div&gt; &lt;div class="se-row"&gt; &lt;button ng-disabled="form.$invalid" ng-click="postNew()" ng-class="{'disabled-btn': form.$invalid}"&gt;Save&lt;/button&gt; &lt;/div&gt; &lt;/form&gt; </code></pre> <p>Note: Yes I know about ng-options but I have no use to send back the entire option object and adjust my server models to accomodate this feature. ng-repeat works just fine.</p> <p>Thanks.</p> <p><strong>Edit</strong> Here is the postNew() function:</p> <pre><code>$scope.postNew = function () { ApiFactory.Crud.save({ ctrl: ApiFactory.ctrl }, $scope.item).$promise.then(function() { //modal stuff }, function(response) { handleError(response); }); }; </code></pre> <p>My Factory is pretty standard:</p> <pre><code>TabsApp.factory('ApiFactory', function ($resource, $http, $q, $rootScope) { var apiService = { List: $resource('/api/patient/:patientId/:ctrl', { patientId: '@patientId', ctrl: '@ctrl' }), Crud: $resource('/api/:ctrl/:id', { ctrl: '@ctrl', id: '@id' }, { update: { method: 'PUT' } }) }; //I set my url parameters here and then broadcast them down to child scopes return apiService; }); </code></pre> <p><strong>EDIT 2</strong> I also tried using ngSubmit which had the identical behavior I described above. The form still submits all the states and even the dummyProperty.</p> <pre><code>&lt;form ng-submit="postNew()"&gt; //same as above &lt;button type="submit"&gt;Save&lt;/button&gt; &lt;/form&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload