CODEWITHSUNDEEP
javascriptformsangularjsangularjs-ng-repeat
Hotamd6
Hotamd6

Reputation: 325

angular JS posting data from a form that uses ng-repeat

I am trying to post data from a html form that utilizes ng-repeat to generate several input text elements and associated dropdown menus. My html template is below, and I am wondering if there is anyway to post the data in "items" or some other ng-model naming method as a collection to the controller. 

 <form ng-submit="submitAssignments()">
    <input type="submit" value="Submit" />
        <div ng-repeat="items in taskList">
               <input type="text" ng-model="items.task" readonly="readonly"  />
               <select ng-model="items.definition" 
                ng-options="option.id as option.definition for option in taskListGroup"></select>
        </div>

I created a jsfiddle(http://jsfiddle.net/y4cQD/24/) with the what I am trying to do, leaving one of the functions empty as I have yet to figure out how to pass the elements from ng-repeat to a post function.

I have been reading up on how ng-repeat creates its own scope, and how it acts a bit odd when you attach the ng-model to primitives (which I think I avoided), but nonetheless I am bit stumped as to where to go from here.

If the strategy in my jsFiddle is not possible to pull off in angular, another option I was thinking of is using ng-repeat to create entirely new forms instead of just new elements and maybe set up a watcher to just post the data per form when the user changes the dropdown. Anyway, as I have been stuck on this for a bit longer than I would like to admit, so any help would be greatly appreciated. Thank you in advance.

Upvotes: 0

Views: 2422

Answers (1)

Chandermani
Chandermani

Reputation: 42669

Your fiddle seems to work fine. If you just output the taskList somewhere in the fiddle using {{taskList}} and play with the dropdown, you can see that the selected dropdown value is getting updated in the taskList item.

You can now use this task list to post to the server using $http or $resource. See here

Upvotes: 1

Related Questions