Solved

Need to read from table created with ng-repeat

Posted on 2013-12-02
3
392 Views
Last Modified: 2013-12-03
I have the below data that is filled using ng-repeat

<tr ng-repeat="task in taskMasterList" on-repeat-finished>
	<td><input type="checkbox" /></td>
	<td>{{ task.TaskCategory }}</td>
	<td>{{ task.TaskDescription }}</td>
	<td><input ng-model="dueDate"></td>
	<td>
		<select ng-model="task.TaskStatus" >                                         
			<option value="1">Open</option>
			<option value="2">In Progress</option>
			<option value="3">Complete</option>
			<option value="4">Deleted</option>
		</select>
	</td>
</tr>
<button ng-click="MasterTaskListSave($event)">Save</button>

Open in new window

-----------------------

This code successfully gets the data from the database (A web service is set up)



var masterTasks = TasksService.GetListingMasterTasks(
{}
, function (data) {
	$scope.taskMasterList = data;          
}
, function (data, status) {
	alert('Failed');
});

Open in new window


I now need to look through the data and get all the rows that are checked
where       <td><input type="checkbox" /></td>  and get the valuses in

<select ng-model="task.TaskStatus"

Any advice is appreciated
0
Comment
Question by:charlesbaldo
3 Comments
 
LVL 7

Assisted Solution

by:cstsang
cstsang earned 100 total points
ID: 39691845
I give you a sample code for your reference,hope it can help:
<html>
<body>
	<script language=javascript>
		function hh()
		{
			var table=document.getElementById("qq"); //get the table object
			var dropDownBox,cells,checkBox;
			for (i=0;i<table.rows.length;i++)   //loop all rows
			{
				cells=table.rows[i].cells;
				checkBox=cells[0].firstChild; //get the check box object
				isCheck=checkBox.checked;     //check whether the check box is checked
				dropDownBox=cells[1].firstChild; //get the dropdown box object
				dropDownBoxValue=dropDownBox.options[dropDownBox.selectedIndex].value; //get the dropdown box value
				alert("Check box is checked "+isCheck+",Drop Down Box Value="+dropDownBoxValue);
			}
		}	
	</script>
	<table id="qq">
		<tr>
			<td><input type="checkbox" checked/></td>
			<td><select>
				 <option selected value="1">Open</option>
                  <option value="2">In Progress</option>
                  <option value="3">Complete</option>
                  <option value="4">Deleted</option>
            	</select>
      		</td>
		</tr>
		<tr>
			<td><input type="checkbox" /></td>
			<td><select>
				 <option  value="1">Open</option>
                  <option selected value="2">In Progress</option>
                  <option value="3">Complete</option>
                  <option value="4">Deleted</option>
            	</select>
      		</td>
		</tr>
	</table>	
	<input type=button onclick="hh()" value="go">
</body>
</html>	

Open in new window

0
 
LVL 82

Accepted Solution

by:
leakim971 earned 400 total points
ID: 39692214
With : <input type="checkbox" ng-model="task.isChecked" />

You may use something like :
        $scope.MasterTaskListSave = function(evt) {
            var taskListToSave = [];
            for(var i=0;i<$scope.taskMasterList.length;i++) {
                var task = $scope.taskMasterList[i];
                if(task.isChecked) {
                    taskListToSave.push(task);
                    // for the demo
                    alert(task.TaskStatus);
                }
            }
            // taskListToSave contains all selected task with their TaskStatus
            // you can send it to server side to save it now
            save(taskListToSave);
        }

Open in new window

0
 

Author Closing Comment

by:charlesbaldo
ID: 39692387
Thank you all
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now