CODEWITHSUNDEEP
angularjs
codeCad
codeCad

Reputation: 13

Angularjs get data from table into labels

I'm inserting data from database in my table and fill the rows with it. When I click on a row a form is loaded and the table disappears. My problem now is that I want to transfer/copy the data from the clicked row into the labels of the form, so how can I get the right data into my labels?

How it should look like

Sample Table.html:

<tr class="mytr" ng-repeat="person in persons | ng-click="loadForm()">
    <td class="{{person.status}}">{{person.PersonId}}</td>
    <td class="{{person.status}}">{{person.Name}}</td>
<tr>

Sample showForm.html:

<form action="">
    <label for="pid">{{person.PersonId}}</label>
    <label for="name">{{person.Name}}</label>
</form>

From Controller:

$scope.loadForm()= function () {
    $scope.content = 
             'http://localhost:49929/App_Plugins/Person/showForm.html';
    }

Upvotes: 0

Views: 102

Answers (2)

Anuradha Gunasekara
Anuradha Gunasekara

Reputation: 6983

Try this.

<tr class="mytr" ng-repeat="person in persons | ng-click="loadForm(person)">
    <td class="{{person.status}}">{{person.PersonId}}</td>
    <td class="{{person.status}}">{{person.Name}}</td>
<tr>

pass the person object as a parameter to the loadForm function.

Update the loadForm to recieve a parameter.

$scope.loadForm = function (person) {
    $scope.content = 'http://localhost:49929/App_Plugins/Person/showForm.html';
     $scope.person = person;
    }

Upvotes: 1

Sachila Ranawaka
Sachila Ranawaka

Reputation: 41397

pass the person object as a parameter to the function and assign it to a separate scope variable. Then use that variable in the form

ng-click="loadForm(person)"

loadForm(person){
   $scope.formObj = person
}

<form action="">
    <label for="pid">{{formObj.PersonId}}</label>
    <label for="name">{{formObj.Name}}</label>
</form>

Upvotes: 1

Related Questions