Form data does not appear

Asked

Viewed 115 times

1

I’m developing an app, in Ionic, an address book.

After the form filled, added a console.log(address) in the controler to see the data, I click the save button and the data does not appear and still says that console.log(address) is undefined.

Follow the codes

Html:

<ion-view title="Endereco" hide-back-button="true">
<ion-content overflow-scroll="true" padding="true" scroll="false" class="has-header">
    <form name="enderecoForm" class="list">
        <ion-list>
            <div ng-controller="enderecoCtrl">
                <label class="item item-input">
                    <input type="text" ng-model="endereco.cep" ng-blur="pegaCep()" placeholder="CEP">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.uf" placeholder="Estado">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.cidade" placeholder="Cidade">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.bairro" placeholder="Bairro">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.logradouro" placeholder="Logradouro">
                </label>
            </div>
        </ion-list>
        <button class="button button-stable button-block" ng-click="adicionarEndereco(endereco)">Salvar</button>
    </form>
</ion-content>

Controller:

angular.module('app.controllers', [])

.controller('loginCtrl', function($scope) {

})

.controller('enderecoCtrl', function ($scope, $http) {
$scope.pegaCep = function () { 
$http.get("php/pegaCep.php?cep="+$scope.endereco.cep).success(function (endereco){
        $scope.endereco = endereco;
    });
 }

$scope.adicionarEndereco = function (endereco){
    console.log(endereco);

}
})

1 answer

0


the ng-controller="enderecoCtrl" should cover any form up to the Ubmit button.

See which Ubmit button is outside the scope of the controller, not known.

See My Solution. Put ng-controller="addressCtrl" in ion-content

<ion-view title="Endereco" hide-back-button="true">
<ion-content overflow-scroll="true" padding="true" scroll="false" class="has-header" ng-controller="enderecoCtrl">
    <form name="enderecoForm" class="list">
        <ion-list>
            <div>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.cep" ng-blur="pegaCep()" placeholder="CEP">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.uf" placeholder="Estado">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.cidade" placeholder="Cidade">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.bairro" placeholder="Bairro">
                </label>
                <label class="item item-input">
                    <input type="text" ng-model="endereco.logradouro" placeholder="Logradouro">
                </label>
            </div>
        </ion-list>
        <button class="button button-stable button-block" ng-click="adicionarEndereco(endereco)">Salvar</button>
    </form>
</ion-content>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.