Angularjs - To pass scope, from modal bootstrap window

Question

I have the next html form (with a input field disabled for default, called unitCreator):

<div class="form-group col-xs-12 col-md-12">
    <label for="unitcreator" class="control-label unit-creator">Org. Unit Creator</label>
    <input type="text" class="form-control unit-creator" id="unit-creator" name="unit-creator" ng-model="unitCreator" ng-disabled="!unitCreator" />
    <a data-toggle="modal" data-target="#myModal"><img src="/WebOpportunities/static/img/ico_search.png" class="search" /></a>
</div>

The icon opens a window modal, with a html table, when i click about a row, i wish input field unitCreator enabled, to pass the column value.

This is my table code html in modal bootstrap:

<div class="modal-body">
<table class="table table-hover">
    <thead>
        <tr>
            <th>Branch</th>
            <th>Name</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="organizational in organizationals" ng-class="{'selected':$index == selectedRow}" ng-click="setClickedRow($index)">
      <td>{{organizational.branch}}</td>
            <td>{{organizational.name}}</td>
        </tr>
    </tbody>
</table>
</div>

This is my code js:

$scope.managers = [
 {name: 'Ana Faedo Iglesias'},
 {name: 'Cristina Menendez'},
 {name: 'Daniel Piriz'}
];

$scope.selectedRow = null;

$scope.setClickedRow = function(index){
    $scope.selectedRow = index;
}
$scope.createSelectRowClick = function(){
  if ($scope.selectedRow==null)
  {
    alert("Any rows selected");
  }
  else
  {
    //here, i enabled the unitCreator field input and i put the column value of the table inside input field unitCreator


    $scope.unitCreator = false; //this not working

    //alert("hola" + $scope.selectedRow);
    //alert("valuetd " + $scope.organizationals[$scope.selectedRow].name)
  }
}

I base in this example to select the table row: http://code.ciphertrick.com/2014/12/06/highlight-a-selected-row-in-ng-repeat-using-ng-class/ Demo: http://code.ciphertrick.com/demo/ngClass/

The column value, i get it so (but i dont know how pass it, to modal window to unitCreator input field):

$scope.organizationals[$scope.selectedRow].name

How could do it? thanks,

Are not yo using angular bootstrap modal- angular-ui.github.io/bootstrap ? How your angular code inside modal template is getting binded with modal values. It will be great if you can create a plnk for your issue. — Harpreet

Mark S. Mark S. · Accepted Answer · 2016-03-29T16:05:35

Instead of passing the index, just pass the object. They you don't have to worry about deferencing from the array

<tr ng-repeat="organizational in organizationals" ng-class="{'selected':$index == selectedRow}" ng-click="setClickedRow(organizational)">

and

$scope.setClickedRow = function(organization){
    $scope.selectedOrganization = organization;

}

Angularjs - To pass scope, from modal bootstrap window

1 Answers