Get value from content triggered by header button


#1

Hi Ionic Developers,

I am trying to get a value from the content triggered by a button function call placed on the headers. I am sucessful on triggering the function BUT I am getting an undefined values. Please help. I found the same query unanswered.

Thank you.


#2

more details more info or code examples?

does your controller know something about the header and the connected models?


#3

Hi @bengtler,

Here’s my code.

HTML:

<ion-modal-view ng-controller="MyController">
    <ion-header-bar class="bar bar-header bar-clear">
        <button class="button button-clear button-primary" ng-click="closeModal(1)"><i class="icon ion-close-circled"></i></button>
        <h1 class="title"> Create New Report</h1>
         <button class="button button-clear button-primary" ng-click="submit(location)"><i class="icon ion-paper-airplane"></i></button>
    </ion-header-bar>

    <ion-content class="backround-feed" scroll="true" has-footer="true">
            <div class="item item-divider item-clear">
                Where is the incident?
            </div>

     <!-- I AM CALLING A DIRECTIVES HERE -->
           <label class="item item-input">
              <input type="text" placeholder="Enter an Address, Place, or ZIP" location-suggestion location="location" ng-model="location.formatted_address">
            </label>
    </ion-content>
</ion-modal-view> 

Controller

.controller('MyController', function($scope, $ionicModal) {

    $scope.location = {};

    $scope.submit = function(location) {

      $scope.location = angular.fromJson(location);
      
      console.log("LOCATION: "+location);
 
    }
})

I found out that when I put the button inside the content, I was able to pass the “location” json values to the controller which I set using a directives. I need to get the same result even when the button is placed on the header.

What work around can we do for this?

Hope you understand it well.

*PS: The codes that i have posted are shortened. Only the related once are posted on this post.

Thank you.


#4

you do not need to set location as parameter for your submit function.

Try to directly use your scope variable:

<button class="button button-clear button-primary" ng-click="submit()"><i class="icon ion-paper-airplane"></i>   </button>

$scope.submit = function() {
  console.log("LOCATION: ", $scope.location);
}

#5

It is working now. Thank you.