1

So I am having a form and when I load the form I call a function with it. The function fills the form with some data.

$scope.fill = function {

                            $scope.formData.name = 'Sara';
                            console.log($scope.formData.name);

                        })

And on the index view I have the following:

<div class="form-group">                
<input type="text" class="form-control" name="name" ng-model="formData.name"></div>

So when I press the the button :

<button ng-controller="formController" ui-sref="front.form.profile" ng-click="fill()">Fill</button>

I want the form about the name to be filled with the value I defined.

The problem I have is that the $scope is updated, on console.log I get the name sara but the form is still empty and does not get updated>

I added $scope.apply() in the end of the function but it does not make any change . Please help

Besa
  • 517
  • 1
  • 8
  • 19

2 Answers2

3

ng-controller="formController" ui-sref="front.form.profile" ng-click="fill()"

Also you created children controller, also $scope is child scope, so that if you change value of child scope, the value of "$scope.formData.name" of parent's scope not changing.

you can using two-way binding via directive. references: https://docs.angularjs.org/guide/directive

I hope that is helpful for you!

NguaCon
  • 124
  • 9
2

Your button has its own controller:

<button ng-controller="formController"

That creates a child scope for the button only. Remove it. You should also create the ui-sref attribute, since you wan't the button to fill the form, not to navigate to another state.

JB Nizet
  • 678,734
  • 91
  • 1,224
  • 1,255
  • but the form is in another state. So I navigate to the state where the form is and then update it – Besa Mar 15 '15 at 14:18
  • The button is in the front page, and the form is in the front.form.profile so I navigate there and call the function – Besa Mar 15 '15 at 14:19
  • The controller in the button is the controller where my function lies. Should I delete it ? – Besa Mar 15 '15 at 14:21
  • That's not at all what your code does. What it does is creating a **new** scope for the button and create a **new** instance of the formController with this new scope. If your goal is to navigate to a different state, then use the ui-sref directive, and pass parameters. – JB Nizet Mar 15 '15 at 14:22
  • I want to navigate to a different state and call the function to populate my view . – Besa Mar 15 '15 at 14:44
  • I actually pass to the new state but the form does not get populated while the scope contains the value. What do you mean by "use ui-sref directive, and pass parameter" ? – Besa Mar 15 '15 at 15:07