Angularjs get the value of textbox in another page

Question

I have a question about angularjs. I have an index.html and arama.html and arama_sonuc.html. In arama.html I have two textboxes with start and end address(Google Maps Autocomplete). I want to show the value of these two textboxes in arama_sonuc.html.

Below you can see my source code:

var app = angular.module('plunker', ['ui.router','ngAutocomplete']);

app.config(function($stateProvider, $urlRouterProvider) {
  // For any unmatched url, send to /index
  $urlRouterProvider.otherwise("/arama");

  $stateProvider
    .state('arama', {
      url: "/arama",
      templateUrl: "arama.html",
      controller: "aramaSayfasiniCagir"
    })
    .state('aramaSonuc', {
      url: "/aramaSonuc",
      templateUrl: "arama_sonuc.html"
      //controller: "aramaSayfasiniCagir"
    });
});

    app.controller('aramaSayfasiniCagir', function($scope, $location){
        $scope.LoginCheck = function() {
            $location.path("aramaSonuc");
        };
    });

    app.controller("inputCtrl",function ($scope) {

        $scope.result1 = '';
        $scope.options1 = {
            country: 'tr'
        };
        $scope.details1 = '';


        $scope.result2 = '';
        $scope.options2 = {
            country: 'tr'
        };
        $scope.details2 = '';
    });

Here is a demo plunker: http://plnkr.co/edit/3vczoJLf7pc0TOocq6nA?p=preview

Can you help me?

Use a service to store the data you want

Norbor Illig
– Norbor Illig

2015-03-23 16:36:55 +00:00
Commented Mar 23, 2015 at 16:36 — Norbor Illig
– Norbor Illig, Commented Mar 23, 2015 at 16:36

Bazinga · Accepted Answer · 2015-03-23 16:51:49Z

You should use services to share data between controllers. here is working plunker:

http://plnkr.co/edit/iTGl1bxVY73ao9kSqNQd?p=preview

var app = angular.module('plunker', ['ui.router', 'ngAutocomplete']);

app.config(function($stateProvider, $urlRouterProvider) {
  // For any unmatched url, send to /index
  $urlRouterProvider.otherwise("/arama");

  $stateProvider
    .state('arama', {
      url: "/arama",
      templateUrl: "arama.html",
      controller: "aramaSayfasiniCagir"
    })
    .state('aramaSonuc', {
      url: "/aramaSonuc",
      templateUrl: "arama_sonuc.html",
      controller: "aramaSayfasiniCagir"
    });
});

app.service('locationService', function() {
  this.details1 = '';
  this.details2 = '';
})

app.controller('aramaSayfasiniCagir', function($scope, locationService) {
    $scope.locationService = locationService;
});

app.controller("inputCtrl", function($scope, $location, locationService) {

  $scope.locationService = locationService;

  $scope.LoginCheck = function() {
    locationService.details1 = $scope.details1;
    locationService.details2 = $scope.details2;
    $location.path("aramaSonuc");
  };
  $scope.options1 = {
    country: 'tr'
  };


  $scope.options2 = {
    country: 'tr'
  };

});

arama.html

<div ng-controller="inputCtrl">
  <div class="input-group input-group-lg">
    <span class="input-group-addon" id="sizing-addon1">
                <img style="width:16px;" src="img/location.png"/>
            </span>
    <input type="text" class="form-control" id="autocomplete" aria-describedby="sizing-addon1" details="details1" ng-autocomplete="result1" options="options1">
  </div>

  <div class="input-group input-group-lg">
    <span class="input-group-addon" id="sizing-addon2">@</span>
    <input type="text" class="form-control" id="autocomplete2" aria-describedby="sizing-addon1" details="details2" ng-autocomplete="result2" options="options2">
  </div>
  <input type='button' ng-click='LoginCheck()' value='send' />
</div>

arama_sonuc.html

i want to display here the value of start and end adress 

 <p><pre>{{locationService.details1 | json}}</pre></p>
 <p><pre>{{locationService.details2 | json}}</pre></p>

Collectives™ on Stack Overflow

Angularjs get the value of textbox in another page

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related